提交表单后清除表单

时间:2010-04-17 17:12:06

标签: jquery

  

可能重复:
  Resetting a multi-stage form with jQuery

提交表单后,其他页面的响应将打印到#GameStorySys。但输入表格的价值仍然存在。一旦提交表单,表单值是否可能消失(但表单仍应保留)?

$("[name='GameStoryForm']").click(function() { 
        $.ajax({
            type: "POST",
                data: $("#GameStoryForm").serialize(),
                url: "content/commentary/index.cs.asp?Process=EditLiveCommentaryStory&CommentaryID=<%=Request.QueryString("CommentaryID")%>", 
                success: function(output) { 
                $('#GameStorySys').html(output);
            },
                error: function(output) {
                $('#GameStorySys').html(output);
                }
        }); 
}); 

3 个答案:

答案 0 :(得分:3)

您可以手动清除它,例如:

$("[name='GameStoryForm']").click(function() { 
  $.ajax({
    type: "POST",
    data: $("#GameStoryForm").serialize(),
    url: "content/commentary/index.cs.asp?Process=EditLiveCommentaryStory&CommentaryID=<%=Request.QueryString("CommentaryID")%>", 
    success: function(output) { 
      $('#GameStorySys').html(output);
      $("#GameStoryForm").get(0).reset();
      //or manually:
      // $("#GameStoryForm :input").not(':button, :submit, :reset, :hidden')
      //                           .val('').removeAttr('checked selected');
    },
    error: function(output) {
      $('#GameStorySys').html(output);
    }
  }); 
});

答案 1 :(得分:0)

我会用javascript:

来做
<script>
document.getElementById(yourFormId).onsubmit = new Function(){this.reset();}
</script>

答案 2 :(得分:0)

如果在AJAX查询的响应函数中执行重置,则在请求返回之前不会进行重置。如果您在onsubmit()事件处理程序中重置表单(如此处所建议的那样),则根本不会重置该表单(因为您在click()处理程序中发送AJAX请求,而不是submit()处理程序)。

你需要做的是在发出AJAX请求后执行重置 - 也就是说,在调用$ .ajax()之后执行重置 - 但是在请求返回时调用的回调函数中没有:

$("[name='GameStoryForm']").click(function() { 
  $.ajax({
    type: "POST",
    data: $("#GameStoryForm").serialize(),
    url: "content/commentary/index.cs.asp?Process=EditLiveCommentaryStory&CommentaryID=<%=Request.QueryString("CommentaryID")%>", 
    success: function(output) { 
      $('#GameStorySys').html(output);
    },
    error: function(output) {
      $('#GameStorySys').html(output);
    }
  });

  $("#GameStoryForm").get(0).reset();
});