Question

我处于两难境地＆＃34;如何使用POST方法存储从我的表单发送的数据＆＃34;。以下是我的表格：

<form class="myForm">
    <div class="form-group">
        <label for="nameForm">Name</label>
        <input type="text" class="form-control" id="nameForm" placeholder="Your name here">
    </div>
    <div class="form-group">
        <label for="selectForm">Your college year</label>
        <select class="form-control" id="selectForm">
            <option>1</option>
            <option>2</option>
            <option>3</option>
            <option>4</option>
            <option>5</option>
        </select>
    </div>
    <div class="form-group">
        <label for="textForm">Comment(s)</label>
        <textarea class="form-control" id="textForm" rows="3" placeholder="Leave your comment(s) here"></textarea>
    </div>
    <button type="submit" class="btn btn-primary">Send</button>
</form>

我想要的只是当用户提交答案时，它将存储在 .json 文件中，使用POST方法和jQuery 。但是如何使用这种方法呢？我需要包含一个存储表单数据的 .json 文件？

注意：我如何知道在POST方法中使用的正确URL？我的意思是：

$.post( "urlHere", function(data) {
   $(".result").html(data);
});

提前致谢，希望你们能帮助我！最好的问候！

Answer 1

首先要做的事情......首先给出ID ...给表单一个ID，给它一个动作方法（你称之为POST URL ）..

如果button type="submit"它会发出一个帖子请求，你将永远不会有机会存储该值..因为它在ajax调用中很容易...

这里是您的一些问题的工作代码......还有Jsfiddle

＆＃13;

$("#submitButton").click(function() {

  console.log($("#myForm").attr("action"));
  console.log($("#selectForm option:selected").text());
  console.log($("#nameForm").val());
  console.log($("#textForm").val());

  // you can store the form Value here and then
  // $.ajax({
            type: 'POST',    
            url:$("#myForm").attr("action"),
             data:JSON.stringify({ 
                   name : $("#nameForm").val(),
                   comment : $("#textForm").val() ,
                   selectedOption : $("#selectForm option:selected").text()
                }),
            success: function(msg){
                        // do something else after making the ajax call
             });

});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>


<form id="myForm" class="myForm" action="somepage.html" action="post">
  <div class="form-group">
    <label for="nameForm">Name</label>
    <input type="text" class="form-control" id="nameForm" placeholder="Your name here">
  </div>
  <div class="form-group">
    <label for="selectForm">Your college year</label>
    <select class="form-control" id="selectForm">
            <option>1</option>
            <option>2</option>
            <option>3</option>
            <option>4</option>
            <option>5</option>
        </select>
  </div>
  <div class="form-group">
    <label for="textForm">Comment(s)</label>
    <textarea class="form-control" id="textForm" rows="3" placeholder="Leave your comment(s) here"></textarea>
  </div>
  <button type="button" id="submitButton" class="btn btn-primary">Send</button>
</form>

＆＃13;

我如何使用POST方法？

1 个答案: