[英]Dynamically Add Fields to Razor Form
我有一个Razor表单,其中包含我想要动态添加项目的项目列表/表格。 您可以从下拉列表中选择项目,单击“添加”,下拉列表中的项目将添加到列表中。 然后,当我提交表单并且我的控制器的HttpPost
方法可以处理输入时,我希望所有这些都通过POST
发送。
有没有办法动态添加字段,仍然能够接受它们作为HttpPost
函数中的参数?
第一个答案是正确的,因为您可以遍历表单集合以获取表单元素中动态插入字段的值。 我只是想补充一点,你可以利用一些整洁的绑定。
下面的代码接受针对操作发布的动态文本框的动态列表。 此示例中的每个文本框都与dynamicField
具有相同的名称。 MVC很好地将这些绑定到一个字符串数组中。
完整的.NET小提琴: https : //dotnetfiddle.net/5ckOGu
示例代码(为清晰起见,代码段)动态添加示例字段
@using (Html.BeginForm())
{
@Html.AntiForgeryToken()
<div id="fields"></div>
<button>Submit</button>
}
<div style="color:blue"><b>Data:</b> @ViewBag.Data</div>
<script type="text/javascript">
$(document).ready(function() {
var $fields = $('#fields');
$('#btnAddField').click(function(e) {
e.preventDefault();
$('<input type="text" name="dynamicField" /><br/>').appendTo($fields);
});
});
</script>
接受帖子中动态字段的操作的示例代码。
[HttpPost]
public ActionResult Index(string[] dynamicField)
{
ViewBag.Data = string.Join(",", dynamicField ?? new string[] {});
return View();
}
输出截图
<form>
元素中包含的每个组合框/ hiddenfield / textbox / ...都会在提交时发布。 如果您在运行中创建它们或默认情况下准备好它们并不重要。 然而,最大的区别在于,动态创建的那些不能真正利用我们习惯的那种整洁的绑定。 您还必须手动执行验证等。
然后你会有一个像这样的方法:
public ActionResult HandleMyPost(FormCollection form)
{
// enumerate through the FormCollection, perform validation etc.
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.