MVC驗證在彈出窗口中無法正常工作

Question

我試圖利用MVC中的內置驗證，它似乎沒有工作。如果我將表單中的字段留空，我會返回「成功保存」。信息。

不應該在表單中標記爲必填字段？

控制器：

public ActionResult Create([DataSourceRequest] DataSourceRequest request, ACore.Asset assetForm) 
    { 
     var results = new 
     { 
      value = false, 
      Message = "" 
     }; 

     if (ModelState.IsValid) 
     { 
      results = new 
      { 
       value = true, 
       Message = "Successfully Saved." 
      }; 

      return Json(results); 
     } 

     results = new 
     { 
      value = false, 
      Message = "Please check the form values." 
     }; 

     return Json(results); 
    } 

視圖（冷凝）：

@using (Html.BeginForm("Create", "Asset", FormMethod.Post, new { id = "frmAsset"})) 
{ 
    @Html.AntiForgeryToken() 
    @Html.ValidationSummary(true) 

    <div class="tempStyle"> 
     <div class="editor-label fl"> 
      @Html.LabelFor(model => model.AssetName) 
     </div> 
     <div class="editor-field"> 
      @Html.EditorFor(model => model.AssetName) 
      @Html.ValidationMessageFor(model => model.AssetName) 
     </div> 
    </div> 
    <div style="position: relative;"> 
     <input type="button" value="Save" id="btnSave" /> 
    </div> 

的JavaScript處理我保存：

var saveAsset = function (e) { 
     var form = $("#frmAsset"); 
     $.ajax({ 
      type: "POST", 
      url: "/Asset/Create", 
      data: $(form).serialize(), 
      success: function (data) { 
       if (data.value == true) { 
        alert(data.Message); 

        // Close popup window 
        var window = $('#AssetEditorPopUp').data("kendoWindow"); 
        window.close(); 

        // Refresh grid to show changes 
        $('#grid').data("kendoGrid").dataSource.read(); 

        return; 
       } 

       alert(data.Message); 

      }, 

      error: function() { 
       alert("There was an error editing the asset."); 
      } 
     }); 
    }; 

型號：

public class Asset 
{ 
    [ScaffoldColumn(false)] 
    public int AssetId { get; set; } 

    [Required] 
    [Display(Name="Asset Name:")] 
    public string AssetName { get; set; } 

    public string AssetFormerName { get; set; } 
    public string Seg1Code { get; set; } 
    public string Seg3Code { get; set; } 
    public bool? ActiveFlag { get; set; } 
    public string Address1 { get; set; } 
    public string Address2 { get; set; } 
    public string City { get; set; } 
    public string State { get; set; } 
    public string AssetType { get; set; } 

    [Display(Name = "ZipCode:")] 
    [RegularExpression("([a-zA-Z0-9 .&'-]+)", ErrorMessage = "Enter only alphabets and numbers of First Name")] 
    public string ZipCode { get; set; } 
} 

這就是我做POST而不是ajax。

Answer 1

您的按鈕被設置爲類型的按鈕，應提交。你沒有激發表單提交處理程序，所以驗證沒有執行。

創建您的形式是這樣的：

@using (Html.BeginForm("Create", "Asset", FormMethod.Post, new { id = "frmAsset"})) 
{ 
    @Html.AntiForgeryToken() 
    @Html.ValidationSummary(true) 

<div class="tempStyle"> 
    <div class="editor-label fl"> 
     @Html.LabelFor(model => model.AssetName) 
    </div> 
    <div class="editor-field"> 
     @Html.EditorFor(model => model.AssetName) 
     @Html.ValidationMessageFor(model => model.AssetName) 
    </div> 
</div> 
<div style="position: relative;"> 
    <input type="submit" value="Save" id="btnSave" /> 
</div> 

然後你可以用下面的JavaScript：

$(function(){ 
    $("#frmAsset").submit(function(evt){ 
     var form = $(evt.currentTarget); 

     if(form.validate().isvalid() 
     { 
      // your handler here 
     } 
     evt.preventDefault(); // prevent the form from posting normally 
     return false; 
    }; 
}; 

我會看着AJAX.BeginForm幫手，它更適合於你是什麼在這裏做。

nb。我沒有在ide中輸入這個，所以我不知道它是否是100％有效的，你需要測試它。