سازگارسازی کلاسهای اعتبارسنجی Twitter Bootstrap 3 با فرمهای ASP.NET MVC
نویسنده: علی کورش فر
تاریخ: ۱۳۹۳/۰۵/۱۰ ۱۹:۱۰
آدرس: www.dntips.ir
| مطالب | ۳۶۹۴ |
| نویسندگان | ۲۷۶ |
| گروههای مطالب | ۱۰۲۴ |
| نقشههای راه | ۱۱۹ |
| دورهها | ۱۴ |
| اشتراکها | ۱۷۹۱۴ |
using System.ComponentModel.DataAnnotations;
using System.ComponentModel.DataAnnotations.Schema;
namespace FormValidationWithBootstrap.Models
{
[Table("Product")]
public class ProductModel
{
[Key]
public int Id { get; set; }
[Required(ErrorMessage = "{0} یک فیلد اجباری است و باید آن را وارد کنید.")]
[StringLength(50, ErrorMessage = "طول {0} باید کمتر از {1} کاراکتر باشد.")]
[Display(Name = "نام کالا")]
public string Name { get; set; }
[Required(ErrorMessage = "{0} یک فیلد اجباری است و باید آن را وارد کنید.")]
[Display(Name = "قیمت")]
[DataType(DataType.Currency)]
public double Price { get; set; }
[Required(ErrorMessage = "{0} یک فیلد اجباری است و باید آن را وارد کنید.")]
[Display(Name = "موجودی")]
public int Qty { get; set; }
}
} using System.Web.Mvc;
using FormValidationWithBootstrap.Models;
namespace FormValidationWithBootstrap.Controllers
{
public class ProductController : Controller
{
// GET: Product
public ActionResult Index()
{
return View();
}
public ActionResult New()
{
return View();
}
[HttpPost]
public ActionResult New(ProductModel product)
{
if (!ModelState.IsValid)
return View(product);
if (product.Name != "پفک")
{
ModelState.AddModelError("", "لطفا مشکلات را برطرف کنید!");
ModelState.AddModelError("Name", "فقط محصولی با نام پفک قابل ثبت است :)");
return View(product);
}
// todo:save...
return RedirectToAction("Index");
}
}
} @model FormValidationWithBootstrap.Models.ProductModel
@{
ViewBag.Title = "New";
}
<h2>کالای جدید</h2>
@using (Html.BeginForm())
{
@Html.AntiForgeryToken()
<div>
<hr />
@Html.ValidationSummary(true, "", new { @class = "alert alert-danger" })
<div>
@Html.LabelFor(model => model.Name, htmlAttributes: new { @class = "control-label col-md-2" })
<div>
@Html.EditorFor(model => model.Name, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.Name, "", new { @class = "text-danger" })
</div>
</div>
<div>
@Html.LabelFor(model => model.Price, htmlAttributes: new { @class = "control-label col-md-2" })
<div>
@Html.EditorFor(model => model.Price, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.Price, "", new { @class = "text-danger" })
</div>
</div>
<div>
@Html.LabelFor(model => model.Qty, htmlAttributes: new { @class = "control-label col-md-2" })
<div>
@Html.EditorFor(model => model.Qty, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.Qty, "", new { @class = "text-danger" })
</div>
</div>
<div>
<div>
<input type="submit" value="ثبت" />
<input type="reset" value="ریست" />
@Html.ActionLink("بازگشت به لیست", "Index", "Product", null, new {@class="btn btn-default"})
</div>
</div>
</div>
}
@section Scripts {
@Scripts.Render("~/bundles/jqueryval")
<script>
// override jquery validate plugin defaults
$.validator.setDefaults({
highlight: function (element) {
$(element).closest('.form-group').addClass('has-error');
},
unhighlight: function (element) {
$(element).closest('.form-group').removeClass('has-error').addClass('has-success');
},
errorElement: 'span',
errorClass: 'help-block',
errorPlacement: function (error, element) {
if (element.parent('.input-group').length) {
error.insertAfter(element.parent());
} else {
error.insertAfter(element);
}
}
});
$(function () {
$('form').each(function () {
$(this).find('div.form-group').each(function () {
if ($(this).find('span.field-validation-error').length > 0) {
$(this).addClass('has-error');
}
});
});
});
</script>
}