如何在ajax提交(而不是表单重置)后更新表单字段的默认值



我使用jQuery通过AJAX提交表单。这会更新数据库记录,然后返回成功或失败的响应。我遇到的问题不是关键性的,更多的是为了方便。

当重置表单时,它会将页面加载时的所有字段重置为默认值(为了简单起见)。这不是我想要的行为。我想更改这一点的原因是,如果我提交了表单,然后决定再次更改值,然后我决定将表单重置回上次提交的值,它会重置回初始默认值,而不是我最近提交并保存在数据库中的新值。

为了更好地解释这一点,我将用用户用户名的表单字段来显示我的过程。

Username: SomeDefaultUserNameFetched

然后我将用户名更改为Foo。

Username: Foo

我通过AJAX提交了表单,并得到了成功的回复。然后我决定也许我不喜欢Foo,而更喜欢Bar。

Username: Bar

然后我决定我不喜欢Bar,Foo也很好,所以我决定重新设置表格。重置表单会给我:

Username: SomeDefaultUserNameFetched

正如你所看到的,表单重置并没有保存我最近提交的表单数据。因此,我的问题是,如果可能的话,我如何更新表单默认值,以便当我点击重置时,表单将使用我最近提交的内容重置字段。

谢谢,我真的希望有人能把我推向正确的方向,或者让我知道这是否可能。

更新:如果可能的话,我希望能够将其保存到DOM中。默认值最初存储在哪里?我知道我可以修改我的自定义表单重置来处理表单元素值的设置,但如果有更新DOM的方法,我尽量不必引起这种开销。

感谢的协助

我可以想出三种方法来做到这一点:

1) 发送一个新的ajax请求并从数据库中获取数据,以便在表单重置时显示最新的数据。

2) 保留一个JSON对象(例如form_state),它将跟踪表单的最新有效状态

3) 将默认值保留在一些隐藏字段中(甚至作为属性),并从那里重置表单

创建一个名为default:的属性

<input type="text" default="Some Name" id="name" />

当你想更新默认值时,只需使用这样的东西:

$("#name").attr("default","Ivan Castellanos")

重置按钮将非常简单:

$("#reset_btn").click(function(){
    $("[default]").val(function(){return $(this).attr("default")})
})

祝你好运。

<input type="reset">按钮更改为普通按钮,然后添加自己的点击事件处理程序。在ajax提交中保存提交的值,在按钮点击处理程序中更改回保存的值:

<input type="button" id="resetForm" value="Reset">
<script>
$("#resetForm").click(function() {
   // restore previously saved form values here
});
</script>

至于如何保存这些值,我将把它留给读者练习。。。(提示:我要么使用一个对象,要么为每个表单元素添加数据属性。)

找到的解决方案:我发现:http://www.w3schools.com/jsref/prop_text_defaultvalue.asp作为我的解决方案。通过循环浏览我的提交内容,我可以在默认值更改时更新它们。

相关内容

  • 没有找到相关文章

最新更新