0

当用户编辑值并点击重置按钮时，我正在寻找一种重置表单的方法。

我的表单包含： 2 个文本字段 4 个复选框

值来自我在模型中制作的这 6 个元素：

    public class MyModel
    {
        public MyModel()
        {
            Field1 = 8;
            Checkbox1 = true;
            Checkbox2 = true;
            Checkbox3 = true;
            Checkbox4 = true;
            Field2 = 1; 
        }

        [DisplayName("TextField 1")]
        [Range(4, 64, ErrorMessage = "Test Error")]
        public int Field1 { get; set; }

        [DisplayName("CheckBox 1")]
        public bool Checkbox1 { get; set; }

        [DisplayName("CheckBox 2")]
        public bool Checkbox2 { get; set; }

        [DisplayName("CheckBox 3")]
        public bool Checkbox3 { get; set; }

        [DisplayName("CheckBox 4")]
        public bool Checkbox4 { get; set; }

        [DisplayName("TextField 2")]
        [Range(1, 50, ErrorMessage = "Test Error")]
        public int Field2 { get; set; }

    }
}

因此，例如，当用户取消选中复选框 1 并将值 1 从 Field2 编辑为 199 并点击重置按钮时，所有元素都将重置为 MyModel() 中的值

谁能帮我解决这个问题？

4

2 回答 2

2

只需使用<input type="reset" />. 您不需要 jQuery 或刷新，至少从 marquee 标记开始，此功能已内置到浏览器中。

于 2013-05-01T08:54:55.283 回答
1

如果您不想在客户端执行此操作，这实际上非常容易，它只会重新加载表单。但是，我猜你想做这个客户端。

如果您不想走 MVVM 路线（KnockoutJS 等），那么这是基本思想（在 jQuery 中）：

$(function() {
   // You can make this more efficient by holding the element Ids in the array and setting their values in a loop.
   var prevValues = {};
   prevValues.checkbox1 = $('#checkbox1').is(":selected"); // true or false

   $('#reset').on("click", function() {
       // reset values here
       $('#checkbox1').prop("checked", prevValues.checkbox1);
   });
});


<input type="checkbox" id="checkbox1" />

<input type="button" id="reset" />
于 2013-05-01T08:29:48.853 回答