Question

我在View中有一个强类型文本框，并且有一个ADD按钮。

用户在TextBox中输入说明并单击ADD。此说明已添加到列表中。

添加到列表后，我想清除此TextBox。

当我使用ModelState.Clear时，它清除了整个模型，包括List，因为它也是ViewModel的一部分。

当我使用客户端javascript函数时，文件框会在ADD功能完成之前被清除。

如何首先将值添加到列表中，然后使用javascript清除文本框？

使用我使用的jQuery清除：

<script type="text/javascript">
     $("#AddButton").click(function() {
        $("#textbox1").val("");
     });
</script>

Answer 1

接受模型财产的隐藏归档。

     @Html.HiddenFor(x => x.prop)

并使用普通文本框

<input type="text" id="textbox1" />

现在点击添加时首先将值分配给隐藏文本框和

之后

<script type="text/javascript">
     $("#AddButton").click(function() {
       $("#prop").val($("#textbox1").val()); 
       $("#textbox1").val("");
     });
</script>

Answer 2

这个JS函数只是清除你的字段，但不更新你的模型。您无法直接从JS更新MVC模型，因为它已在服务器端转换为纯HTML。从这一点来看，您有三种方法：

服务器端：不要使用ModelState.Clear而是使用ModelState.Remove。在这种情况下，您可以指定要删除的模型的哪个部分。
客户端（更多工作）：根本不使用MVC模型，而是通过JS动态加载和更新数据。在这种情况下，我会使用第三部分。像AngularJS或Knockout这样的库。
客户端（不建议）：使用JQuery将新值发回服务器端（例如$ .ajax（{...}）），如果成功，则从脚本更新HTML页面（JQuery也有帮助））。

注意：最后两种方法可能需要额外的安全工作。所以我建议玩第一个。

Answer 3

无法在model的MVC jQuery中添加值。但有一件事你可以做。

只需创建list类型模型class，然后在页面上添加控件型号兼容名称。
之后，当您post页面时，您将获得所有记录 list。

在将项添加到List之前，TextBox会被清除

3 个答案: