如何在MVC中的模型视图中重置字段的编辑器

Question

我有一个可以在其中输入值的网页。 为此，我提供了类似这样的代码

<td colspan="2">
    @Html.EditorFor(model => model.Line1, new { id= "txtLine1" })
</td>

会在网页的视图中为地址行1创建一个编辑器字段。 现在，单击“重置”按钮，我希望在Line1的编辑器中填充任何内容，应将其清除。 为此，我正在使用重置按钮和javascript，如下所示

<input type="button" value="reset" id="btnReset" />

<script type="text/javascript">
 $(document).ready(function () {
    $("#btnReset").click(function () {           
            $("#txtLine1").val("");     
        });
     });
</script>

但这对我不起作用。 尝试了很多，谷歌搜索了很多，但是似乎没有解决方案。 甚至尝试过给输入type =“ reset”。 请为此提供最佳解决方案

Answer 1

您正在通过html属性中指定的ID引用Editorfor控件。 “ txtLine1”。 如果您查看生成的html，则根据您的模型绑定其“ Line1”。

转到下面，它可以正常工作。

<script>
 $(document).ready(function () {
    $("#btnReset").click(function () {
            $("#Line1").val("");
        });
     });
</script>

Answer 2

我更喜欢将代码放在元素内（如果仅包含一行），而不是创建新函数。

看，也许这段代码对您有用。

<input id="btnReset" type="button" value="reset" 
        onclick="javascript: $('#Line1').val('');" />

Answer 3

我刚刚弄清楚了您的代码段问题是什么。 您正在为未渲染的EditFor()提供一个ID。 您快要在那里了，并且也正在使用正确的overload 。 如果要为输入分配自定义ID，则需要使用htmlAttributes 。 因此，从

@Html.EditorFor(model => model.Line1, new { id= "txtLine1" })

至

@Html.EditorFor(model => model.Line1, new { htmlAttributes = new { @id = "txtLine1" } })

我已经在我的本地计算机上对此进行了测试，它可以按您的意愿工作。