我正在尝试在我的asp.net mvc 4应用程序中创建动态控件。我想要的是当我提交时,我想验证必填字段。所以我们假设有一个字段类型Checkbox
已创建并且是强制性的。我想确保在提交之前对其进行检查。我需要jquery来验证还是可以通过任何其他方式完成?
查看模型
public class SignupViewModel : IValidatableObject
{
public List<MembershipControls> Controls { get; set; }
public List<Groups> Groups { get; set; }
}
型号
public class Groups
{
public virtual int Id { get; set; }
public virtual string GroupTitle { get; set; }
}
public class MembershipControls
{
public virtual int Id { get; set; }
public virtual string UserId { get; set; }
public virtual string ControlType { get; set; }
public virtual string Caption { get; set; }
public virtual string Name { get; set; }
public virtual string Mandatory { get; set; }
public virtual string Content { get; set; }
public virtual string GroupTitle { get; set; }
public virtual string RadioButtonOptions { get; set; }
public virtual string SelectOptionValues { get; set; }
public virtual string SelectOptionText { get; set; }
}
查看
@foreach (var groups in Model.Groups)
{
<label style="font-weight:bold">@groups.GroupTitle</label>
<div style=" border: 1px solid #CCCCCC;padding:5px">
@foreach (var row in Model.Controls.Where(r => r.GroupTitle == groups.GroupTitle))
{
<div style="padding:7px">
@if (row.ControlType == "Single Line Text")
{
<label>@row.Caption</label>
<input type="text" name="@row.Name" />
}
else if (row.ControlType == "Multi Line Text")
{
<label>@row.Caption</label>
<textarea name="@row.Name"></textarea>
}
else if (row.ControlType == "Yes/No Choice(Radio Buttons)")
{
<div>
<label>@row.Caption</label>
 
<input type="radio" name="@row.Name" value="Yes" />   Yes
 
<input type="radio" name="@row.Name" value="No" />   No
</div>
}
else if (row.ControlType == "Checkbox")
{
<div>
<input type="checkbox" name="@row.Name"/> @row.Caption
</div>
}
else if (row.ControlType == "Date")
{
<div>
<label>@row.Caption</label>
<input type="date" name="@row.Name"/>
</div>
}
</div>
}
</div>
}
答案 0 :(得分:1)
只需指定一个类,例如 验证 到所有动态控件,您可以通过为所有类型的控件编写通用验证函数,使用jquery轻松完成。下面的代码简要介绍了如何继续......
$("input[type=submit]").click(function () {
$(".validate").each(function () {
//Textbox validation
if ($(this).is("input[type=text]")) {
//validation logic for textbox
}
//TextArea Validation
if ($(this).is("textarea")) {
//validation logic for TextArea
}
//RadioButton Validation
if ($(this).is("input[type=radio]")) {
//validation logic for RadioButton
}
//Checkbox Validation
if ($(this).is("input[type=checkbox]")) {
//validation logic for Checkbox
}
//Date Validation
if ($(this).is("input[type=date]")) {
//validation logic for Date field
}
});
});
从控制器传递数据时,请使用必填字段&#34;清空&#34;如果它不是强制性的,或者将该字段设为Mandatory = "validate";
如果该字段是必填字段,则会自动添加该字段。
在您的视图中,您可以为所有控件添加一行class="@row.Mandatory"
为了有条件地添加类,我已经为文本框创建了它,将其应用于其他控件。
E.g。
<input type="text" name="@row.Name" class="@row.Mandatory" />
希望这有助于:)
答案 1 :(得分:0)
我建议首先创建局部视图而不是创建动态控件,然后有很多方法可以用来验证局部视图。
您可以使用DataAnnotations
进行服务器端验证,使用Unobtrusive
jQuery
进行客户端验证。