如何在Ajax更新后更新表单重置“基线状态”

Question

我有一个取消/重置的表单。使用Ajax完成更新。如果我提交（成功）更新，然后对复选框进行额外更改，然后选择取消（读取：重置），重置将一直返回到原始值。请注意，数据库没有更新（由于没有提交），但显示的内容不准确且具有误导性。

如何更新表单的“基线状态”（？），以便取消/重置返回到新版本的表单值。

Answer 1

我会执行额外的AJAX调用以从数据库中检索当前值以重置值。您可以将应用程序设计为在页面加载时使用相同的查找，并在单击重置时使用。

另一个选项是存储每个表单字段HTML5 data attributes中最后一次保存的值。单击重置后，您可以根据数据属性重新填充值。例如。

<!-- HTML -->
<input type="text" name="firstName" id="firstName" value="jim" data-last-value="joe" />

/* JS - Do this on reset. */ 
$('[data-last-value]').each(function() {
    var lastValue = $(this).attr('data-last-value');  
    $(this).val(lastValue);
});