Ненадакучлівая бок кліента праверка ў MVC4 не працуе

У мяне ёсць макет старонкі з усімі сцэнарамі, як паказана ніжэй.

<!DOCTYPE HTML>

<head>
    <title>My Site</title>
    <link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    
    
    <script src="~/Scripts/Jquery/jquery-1.9.1.js"></script>
    <script src="~/Scripts/Jquery/jquery-ui-1.10.2.js"></script>
    <script src="~/Scripts/Jquery/jquery.unobtrusive-ajax.js"></script>
    <script src="~/Scripts/Jquery/jquery.validate.js"></script>
    <script src="~/Scripts/Jquery/jquery.validate.unobtrusive.js"></script>
    
    
               
</head>
<body>
  @RenderBody()
</body>
</html>

Тады ў мяне ёсць рэгістрацыйная форма, як паказана

@model Mysite.Models.Account.Account
@{
    Layout = "~/Views/Shared/_Layout.cshtml";
}
 @using (Html.BeginForm(null, null, FormMethod.Post, new { id = "register" }))
{
 @Html.AntiForgeryToken();
 

Login

 @Html.ValidationSummary();
 @Html.EditorFor(m => m.Name)
 @Html.EditorFor(m => m.Address1)
 @Html.EditorFor(m => m.Address2)
 @Html.EditorFor(m => m.Phone1)
<input type="button" value="Register" id="btn1" />
}
<script>
var form = $("#register");
 $("#btn1").click(function (e) {
        e.preventDefault();
        $.ajax({
            url: 'http://localhost:3885/Account/Register',
            data: form.serialize(),
            type: 'POST',
            success: function (result) {},
            error: function (req, status, error) {
                function(req, status, error);
            }
        });
    });
</script>

Мой клас рахункі Мадэль выглядае наступным чынам:

public class Account
{
   public Name name {get; set;}
   public Address Address1 {get; set;}
   public Address Address2 {get; set;}
   public Phone Phone1 {get;set;}
}

дзе кожнае ўласцівасць таксама мадэль клас са сваім уласным EditorTemplates, напрыклад

public class Name
{
   [Required]
   public string FirstName {get; set;} 
   public string MiddleName {get; set;}
   [Required]
   public string LastName {get; set;}
}

і маюць Name.cshtml EditorTemplate, як паказана ніжэй

<div >
 @Html.TextBoxFor(m=>m.FirstName);
 @Html.TextBoxFor(m=>m.MiddleName);
 @Html.TextBoxFor(m=>m.LastName);
<div>

similarly for Address.cshtml and Phone.cshtml

in web.config: -



On clicking Register button on empty form it does ajax post to Register [HttpPost] Controller method. Why does it not give me client side validation messages i think its called Unobtrusive validation ? I don't see any errors in console as well.

11

6 адказы

Кнопка падаваць павінен быць тыпу «адправіць», каб выклікаць праверку VALIDATE Jquery, ці то з дапамогай jQuery плягін самастойна або з ненадакучлівым убудова.

Такім чынам, гэта будзе ініцыяваць праверку:

<input type="submit" value="Register" id="btn1" />

Але, бачачы, як вы ўжо напісалі код для апрацоўкі націску кнопак, гэта можа быць прасцей проста ўручную запусціць праверку

$("#btn1").click(function (e) {

      e.preventDefault();

     //now trigger the form validation, result is 1 or 0
      var result = $('form').valid();  

      $.ajax(
        //details omitted
      );
});
19
дададзена
гэта worked.Was проста цікава, чаму нам трэба відавочна выклікаць form.valid (). Ці ж не павінна яна працаваць без яўнага выкліку ?? Atleast вось што я чытаў ва ўсіх асноўных прыкладах ненадакучлівай праверкі.
дададзена аўтар user2232861, крыніца
я сапраўды выкарыстаў прадставіць button.it ня work.it дагэтуль робіць Аякс постбэк. гэта нешта рабіць з AJAX пост?
дададзена аўтар user2232861, крыніца
@user праверыць прыклады вы наступныя, форма, верагодна, кнопкі адпраўкі. Убудова выконвае праверку ў адказ на прадставіць падзеі формы
дададзена аўтар Dr Blowhard, крыніца
Вы карыстаецеся падзея націску кнопкі. Калі вы хочаце выкарыстоўваць форму адправіць падзея, Вам не трэба будзе выклікаць form.valid() самастойна, так як прадставіць падзея не спрацоўвае, калі форма не з'яўляецца сапраўднай. Такім чынам, замест $ ( «# btn1»). Націсніце (выкарыстоўвайце form.submit (і зрабіць гэты тып кнопкі = «адправіць».
дададзена аўтар mwijnands, крыніца

Я думаю, што вам трэба, каб змяніць парадак спасылак скрыптоў

<script src="~/Scripts/Jquery/jquery-1.9.1.js"></script>
    <script src="~/Scripts/Jquery/jquery-ui-1.10.2.js"></script>
    <script src="~/Scripts/Jquery/jquery.validate.js"></script>
    <script src="~/Scripts/Jquery/jquery.validate.unobtrusive.js"></script>
    <script src="~/Scripts/Jquery/jquery.unobtrusive-ajax.js"></script>
3
дададзена
+1 Што зрабіў трук для мяне рухалася праверкі jQuery скрутак <�б> вышэй бутстраповские JS на мой погляд.
дададзена аўтар erdinger, крыніца
Паспрабаваў цяпер. Няма поспехі !!!
дададзена аўтар user2232861, крыніца
Святое дзярмо. Перасоўванне сцэнары праверкі, перш чым самонастройки цалкам зрабіў гэта для нас.
дададзена аўтар Kris Oye, крыніца

Вы павінны таксама дадаць паведамленні пра памылкі

@Html.EditorFor(m => m.Name)
@Html.ValidationMessageFor(m => m.Name)

 @Html.EditorFor(m => m.Address1)
@Html.ValidationMessageFor(m => m.Address1)

 @Html.EditorFor(m => m.Address2)
@Html.ValidationMessageFor(m => m.Address2)

 @Html.EditorFor(m => m.Phone1)
@Html.ValidationMessageFor(m => m.Phone1)
1
дададзена
Я не думаю, што так, як я не хачу, каб паведамленні пра памылкі для кожнага поля, а ў мяне есть'@Html.ValidationSummary дадаў у верхняй частцы галоўнага акна рахункі для адлюстравання рэзюмэ.
дададзена аўтар user2232861, крыніца
паспрабуйце гэта @ Html.EditorFor (м => m.Name.FirstName)
дададзена аўтар Khaled Musaied, крыніца

У мяне была тая ж праблема, і выявілі, што, калі я пазваню     'Element.valid ()' перад выклікам бібліятэкі для праверкі функцыі ЗДАРЫЛАСЯ, чым больш не будзе правяраць маю форму. Я вырашыў гэта, ствараючы пашырэнне, якое правярае, калі форма была апрацавана, і толькі, чым праверыць, калі элемент з'яўляецца сапраўдным

 $.fn.revalidate = function() {
        if (this.length) {
            var validator = this.closest("form").data("validator");
            if (validator)
                validator.element(this);
        }
        return this;
    };
0
дададзена

калі вашы выкарыстоўваюць _Layout.cshtml выдаліць спасылку наступнай

@Scripts.Render("~/bundles/jquery")

на дзень

што праца для мяне!

0
дададзена
гэта не мае сэнсу, вам трэба дадаць jQuery скрыпты.
дададзена аўтар Cacho Santa, крыніца
Я думаю, што jkarlos магчыма азначала, што ён спасылкі jQuery двойчы.
дададзена аўтар Tony, крыніца
Yeap, то ёсць. дзякуй
дададзена аўтар jcmordan, крыніца

У мяне таксама была аналагічная праблема, якая патрабуе некалькі тыдняў для адладкі. Я выкарыстоўваю ASPX старонку.

The root cause was that Html.BeginForm statement was placed after a <table> tag.

<table>
   <% using (Html.BeginForm("ContainerManagement", "Admin", FormMethod.Post)){%>
</table>

This caused the <form> tag to close before any <input> tag, and thus the unobtrusive client validation not working.

<form action="/Admin/ContainerManagement" method="post" novalidate="novalidate"></form> <tr> <td><input></td> </tr>

So, remember to put Html.BeginForm before <table> tag

<% using (Html.BeginForm("ContainerManagement", "Admin", FormMethod.Post)){%>
<table>...</table>
<% } %>
0
дададзена