jquery検証を使用してこれを行う方法です。あなたのブートストラップで試してみてください。私はそれをテストしたので、この作品が分かります。ここでは、コントローラは次のとおりです。ここで
public class NamesAndLocation
{
public string FirstName { get; set; }
public string LastName { get; set; }
public string Location { get; set; }
}
public class NamesAndLocationList
{
public IList<NamesAndLocation> NamesAndLocation { get; set; }
}
public class HomeController : Controller
{
public ActionResult Index10() //this Method name can change
{
NamesAndLocationList list = new NamesAndLocationList();
list.NamesAndLocation = new List<NamesAndLocation>();
list.NamesAndLocation.Add(new NamesAndLocation { FirstName = "fn1", LastName = "ln1", Location = "loc1" });
list.NamesAndLocation.Add(new NamesAndLocation { FirstName = "fn2", LastName = "ln2", Location = "loc2" });
list.NamesAndLocation.Add(new NamesAndLocation { FirstName = "fn3", LastName = "ln3", Location = "loc3" });
return View(list);
}
が図である。
@model Testy20161006.Controllers.NamesAndLocationList
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index10</title>
<script src="https://code.jquery.com/jquery-1.7.1.min.js"
integrity="sha256-iBcUE/x23aI6syuqF7EeT/+JFBxjPs5zeFJEXxumwb0="
crossorigin="anonymous"></script>
<script src="~/Scripts/jquery.validate.min.js"></script>
<script>
$.validator.setDefaults({
submitHandler: function() {
alert("submitted!");
}
});
$().ready(function() {
$("#signupForm").validate({
rules: {
location0:
{
required: function (element) {
var mybool = $("#fname0").val() == "" || $("#lname0").val() == ""
return mybool;
}
},
location1:
{
required: function (element) {
var mybool = $("#fname1").val() == "" || $("#lname1").val() == ""
return mybool;
}
},
location2:
{
required: function (element) {
var mybool = $("#fname2").val() == "" || $("#lname2").val() == ""
return mybool;
}
}
},
messages: {
location0: "Please add location1",
location1: "Please add location2",
location2: "Please add location3"
}
});
});
</script>
</head>
<body>
@using (Html.BeginForm("", "", FormMethod.Get, new { id = "signupForm" }))
{
for (int i = 0; i < 3; i++)
{
<div class="row">
<div class="col-sm-4 form-group">
@*we have Name and name attributes, but Name is parsed first*@
@Html.LabelFor(x => x.NamesAndLocation[i].FirstName)
@Html.ValidationMessageFor(x => x.NamesAndLocation[i].FirstName)
@Html.TextBoxFor(x => x.NamesAndLocation[i].FirstName, new { id = "fname" + i.ToString(), Name = "fname" + i.ToString() })
</div>
<div class="col-sm-4 form-group">
@Html.LabelFor(x => x.NamesAndLocation[i].LastName)
@Html.ValidationMessageFor(x => x.NamesAndLocation[i].LastName)
@Html.TextBoxFor(x => x.NamesAndLocation[i].LastName, new { id = "lname" + i.ToString(), Name = "lname" + i.ToString() })
</div>
<div class="col-sm-4 form-group">
@Html.LabelFor(x => x.NamesAndLocation[i].Location)
@Html.ValidationMessageFor(x => x.NamesAndLocation[i].Location)
@Html.TextBoxFor(x => x.NamesAndLocation[i].Location, new { id = "location" + i.ToString(), Name = "location" + i.ToString() })
</div>
</div>
}
<input type="submit" value="submit" />
}
</body>
</html>
ボックス検証属性のうちで、私は良いを見つけたことはありませんソリューションであり、多くの場合、https://github.com/JeremySkinner/FluentValidationまたはhttps://foolproof.codeplex.com/ –
に依存しています。独自の検証属性を記述します - [ASP.NET MVC 3での検証の完全ガイド - 第2部] (ht tp://www.devtrends.co.uk/blog/the-complete-guide-to-validation-in-asp.net-mvc-3-part-2) –