为文本框创建一个刷新按钮

Question

我正试图在html助手中为我的model.id创建一个刷新按钮。我正在进行ERP项目，所以多个人会使用该应用程序，所以我需要刷新按钮，所以我尝试了这个MVC在此处输入代码

@Html.EditorFor(model => model.Id, new { id="code", @class = "form-control "})
<button id="button1" style="border: none;width: 50px;height: 50px;" value="Refresh"><i class="fas fa-sync"></i></button> 

javascript---

$("#button1").click(function (event) {
alert('Clicked')
$("#code").val('model.Id')
}); 

但这不起作用，请在这里输入代码

Answer 1

实现这一点的最简单方法是向显示值的EditorFor中的元素添加一个新的data属性。此属性应包含控件的起始值。然后在JS中，当点击"刷新"按钮时，将当前值设置回原始值，如下所示：

$("#button1").click(function(e) {
$("#code").val(function() {
return $(this).data('original-value');
});
});

#button1 {
border: none;
width: 50px;
height: 50px;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!-- @Html.EditorFor(model => model.Id, new { id="code", @class = "form-control", }) -->
<input type="text" id="code" data-original-value="foobar" value="foobar" />
<button id="button1" value="Refresh"><i class="fas fa-sync"></i> Refresh</button>