4

MVC 4 プロジェクトで ajax リクエストを介してフォームを送信するときに、目立たない検証を機能させるのに苦労しています。参考までに、このトピックの人物は、私が行っていることとほぼ同じことを行っています。

MVC 3 および JQuery での手動フォーム検証

そこで行われたことを確認しましたが、まだ機能させることができません。問題は、$("#Form").valid() を実行すると、リクエストを送信してもモデルが無効であっても、常に true が返されることです。バンドルに適切なスクリプトをセットアップしましたが、フォームをクライアント側で正しく検証することができません。これを正しく検証するにはどうすればよいですか? データ注釈が設定されたら、それは「機能するはずだ」と思っていましたが、明らかにそうではありません。

また、この特定のフォームは、部分ビューからも Kendo UI ウィンドウに jQuery でロードされています。この投稿の回答を見た後: Asp MVC unobtrusive Client Validation always return true doing using the form id as the selector と .valid() はまだ true を返しますが、クラス名は false です。ただし、guid 学期 ID は true を返します。

私のコードは以下の通りです:

モデル

public class Class
{
  public Class()
  {
    ClassId = Guid.NewGuid();
  }

  [Key]
  public Guid ClassId { get; set; }

  [Display(Name = "Class Name")]
  [Required(ErrorMessage = "A Class Name is required.")]
  public string ClassName { get; set; }

  public int UserId { get; set; }

  [Display(Name = "Term Type")]
  [Required(ErrorMessage = "The Term Type is required.")]
  public Guid SemesterId { get; set; }

  [ForeignKey("SemesterId")]
  public virtual Semester Semester { get; set; }

  [Display(Name = "Class Year")]
  public int Year { get; set; }

  [Display(Name = "Has Weighted Grades?")]
  public bool HasWeightedGrades { get; set; }

  public virtual List<Grade> Grades { get; set; }

}

@using (Html.BeginForm("AddClass", "", FormMethod.Post, new { name = "AddNewClassForm", id = "AddNewClassForm" }))
{
  <div>
    <div>@Html.LabelFor(m => m.ClassName)</div>
    <div>
      @Html.TextBoxFor(m => m.ClassName, new { @class = "input-xlarge" })
      @Html.ValidationMessageFor(m => m.ClassName)
    </div>
    <div>@Html.LabelFor(m => m.SemesterId)</div>
    <div>
      @Html.DropDownList("SemesterId", null, "-- Select a Term Type --", new { @class = "input-xlarge" })
      @Html.ValidationMessageFor(m => m.SemesterId)
    </div>
  </div>
}

<div>
  <button id="AddClassButton" class="btn btn-primary" type="submit"><i class="icon-plus icon-white"></i> Add Class</button>
  <button id="CancelAddClassButton" class="btn btn-danger" type="submit"><i class="icon-ban-circle icon-white"></i> Cancel</button>
</div>

jQuery イベント

//================================================================================================================================
// AddClassButton: Click event handlers.
//================================================================================================================================
$('#AddClassButton').unbind('click').bind('click', function (e) {
  $.validator.unobtrusive.parse($('#AddClassWindow'));
  var val = $("#AddNewClassForm").validate();
  val.showErrors();
  alert("Is the form valid? " + val.valid());  //Always returns true

  alert("Is Class Name Valid? " + $("#ClassName").valid());  //Still returns true
  alert("Is Semester Id Valid? " + $("#SemesterId").valid());  //Still returns true

  e.preventDefault(); // Prevent this from doing default (possibly submit form).
  e.stopPropagation(); // Prevent infinite loop.
});

バンドル

bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
                      "~/Scripts/jquery.unobtrusive*",
                      "~/Scripts/jquery.validate*"));

//Ignoring these so only the min.js versions get rendered
bundles.IgnoreList.Ignore("jquery.validate.js");
bundles.IgnoreList.Ignore("jquery.validate.unobtrusive.js");
bundles.IgnoreList.Ignore("jquery.unobtrusive-ajax.js");

コントローラ アクション

[Authorize]
public ActionResult AddClass()
{
  var userName = User.Identity.Name;
  var userProfile = db.UserProfiles.SingleOrDefault(x => x.UserName == userName);

  InitializeSemesters();
  InitializeYears();

  return PartialView(new Class() { UserId = userProfile.UserId, Year = DateTime.Now.Year });
}
4

4 に答える 4

0

もしも

alert("Is the form valid? " + val.valid());  //Always returns true

どうですか

alert("Is the form valid? " + $("#AddNewClassForm").valid());  // ???

これは私のために働いた...

于 2013-07-27T16:32:40.043 に答える