部分视图验证MVC模态表单

时间:2017-05-04 09:55:24

标签: jquery asp.net-mvc validation

我知道我做错了什么,但不确定我错过了什么。

我有一张表格

        @using (Html.BeginForm("AddPayment", "Collecting", new { @invoiceId = invoice.Id }, FormMethod.Get, new { @class = "modal-link", @data_target = "#completePaymentModal" }))
        {
          <button id="completeInvoicePaymentButton" class="btn btn-primary">
            <i class="fa fa-money"></i>                 
          </button>
        }    

我的模态容器看起来像这样

<div class="modal inmodal" id="completePaymentModal">
  <div class="modal-dialog">
    <div id="mainContent" class="modal-content col-sm-12">



    </div>
  </div>
</div>

以上所有内容都在我的index.cshtml中。

我的部分视图看起来像这样。

@model ViewModels.InvoiceModel
@using Infrastructure.Resources;

@using (Html.BeginForm())
{
    @Html.AntiForgeryToken()

    <div class="form-horizontal">
      <div class="modal-header">
        <h4 class="pull-left">@UILabels.Collecting</h4>
      </div>
      <div class="modal-body">

        @Html.ValidationSummary(true, "", new { @class = "text-danger" })
        @Html.HiddenFor(model => model.Id)

        <p>S-a incasat plata facturii @Model.Id / @Model.InvoiceDate emisa clientului @Model.Company.Name </p>

        <div class="form-group">
          <div class="col-md-12">
            @Html.LabelFor(model => model.PaymentDate, htmlAttributes: new { @class = "control-label col-md-12 collecting-modal-label" })
            @Html.EditorFor(model => model.PaymentDate, new { htmlAttributes = new { @class = "form-control" } })
            @Html.ValidationMessageFor(model => model.PaymentDate, "", new { @class = "text-danger" })
          </div>
        </div>
        <div class="form-group">
          <div class="col-md-12">
            @Html.LabelFor(model => model.Observations, htmlAttributes: new { @class = "control-label col-md-12 collecting-modal-label" })
            @Html.TextAreaFor(model => model.Observations, htmlAttributes : new { @class = "form-control text-area"  } )
            @Html.ValidationMessageFor(model => model.Observations, "", new { @class = "text-danger" })
          </div>
        </div>
      </div>
      <div class="modal-footer">
        <div class="form-group">
          <div class="col-lg-6">
            <button type="button" class="btn btn-white pull-left" data-dismiss="modal">
              @UILabels.Cancel
            </button>
          </div>
          <div class="col-lg-6 pull-right">
            <input type="submit" value="@UILabels.SaveBtn" class="btn btn-primary" />
          </div>
        </div>
      </div>
    </div>
}

我的控制器看起来像这样

  [HttpGet]
        public ActionResult AddPayment(int invoiceId)
        {
            return PartialView("AddPayment", _iInvoiceService.GetById(invoiceId));
        }

        [HttpPost]
        public ActionResult AddPayment(InvoiceModel invoice)
        {
            if (ModelState.IsValid)
            {

            }

            return PartialView("AddPayment", invoice);
        }

我的属性看起来像这样(来自InvoiceModel)

[DisplayFormat(DataFormatString = "{0:dd.MM.yyyy}", ApplyFormatInEditMode = true)]
[Required(ErrorMessage = "Price is required")]
[Display(Name = "Data incasarii")]
public DateTime? PaymentDate { get; set; }

我使用这个jquery来加载我的数据

$(function () {
  $('.modal-link').on("click", function (e) {
    $form = $(this);
    e.preventDefault();
    //replace the get with this.href to load the edit page
    $.get($form.attr('action'), function (data) {
      //replace the content returned
      $("#mainContent").html(data);
    });
    //show the modal
    $('#completePaymentModal').modal({
      keyboard: true,
    }, 'show');
    return false;
  })
});

一切正常,除了验证,当我提交表单Model.IsValid是假的,但我的观点没有任何错误。 我知道我必须从服务器获得验证回到客户端

$form.removeData('validator');
$form.removeData('unobtrusiveValidation');
$form.each(function () { $.data($(this)[0], 'validator', false); }); 
$.validator.unobtrusive.parse(".modal-link");

这样的东西,但我不知道我应该在哪里添加它,因为Post不是使用JQuery完成的。我是否需要从JQuery进行POST?

编辑:

[HttpPost]
    public ActionResult AddPayment(InvoiceModel invoice)
{
    if (ModelState.IsValid)
    {

    }

    return RedirectToAction("Index");
}

$.get($form.attr('action'), function (data) {
  //replace the content returned
  $("#mainContent").html(data);
});
$form.data('validator', null);
$.validator.unobtrusive.parse($form);

添加了这个,仍然无法正常工作。

0 个答案:

没有答案