Ненавязчивая проверка стороны клиента в MVC4 не работает

У меня есть страница макета со всеми сценариями, как показано ниже.Ненавязчивая проверка стороны клиента в MVC4 не работает

<!DOCTYPE html> 
<html lang="en"> 
<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"> 
    <some custom css> 
    <modernizr> 
    <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> 
    <some custom scripts> 
    <bootstrap scripts> 
    <knockout scripts>   
</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(); 
<h1>Login</h1> 
@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>

аналогично для Address.cshtml и Phone.cshtml

в web.config: -

<add key="ClientValidationEnabled" value="true" /> 
<add key="UnobtrusiveJavaScriptEnabled" value="true" />

При нажатии кнопки Регистрация на пустом виде она ajax post для регистрации метода [HttpPost] Controller. Почему это не дает мне сообщения о проверке на стороне клиента, я думаю, что это называется ненавязчивой валидацией? Я также не вижу ошибок в консоли.

источник

2013-05-21 user2232861

кнопка отправки должна быть типа «отправить», чтобы вызвать JQuery Validate валидация, независимо от того, используется ли плагин 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 
    ); 
});

источник

2013-05-21 20:21:43

Это сработало. Просто интересно, почему нам нужно явно вызвать form.valid(). Разве это не должно работать без явного вызова? По крайней мере, это то, что я читал во всех основных примерах ненавязчивой проверки. – user2232861

@user проверить примеры, за которыми вы следуете, формы могут, вероятно, отправить кнопки. Плагин выполняет валидацию в ответ на событие отправки формы –

Я действительно использовал кнопку submit.it не работает. Он все еще выполняет обратную передачу ajax. это как-то связано с ajax-сообщением? – user2232861

Я думаю, что вам нужно, чтобы изменить порядок скриптов ссылается

<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>

источник

2013-05-21 19:45:47

Пробовал это сейчас. Не повезло!!! – user2232861

+1 Что за трюк для меня было перемещение пакета проверки jQuery ** выше ** bootstrap js на мой взгляд. – erdinger

Святое дерьмо. Перемещение скриптов проверки перед загрузкой полностью сделало это для нас. –

-1

Вы должны также добавить сообщения об ошибках

@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)

источник

2013-05-21 20:06:37

Я не думаю, что я не хочу показывать сообщения об ошибках для каждого поля, вместо этого у меня есть'@Html.ValidationSummary, добавленный в верхней части основного вида учетной записи, чтобы отобразить сводку. – user2232861

попробуйте это @ Html.EditorFor (m => m.Name.FirstName) –

если ваш помощью _Layout.cshtml удалить ссылку следовать за

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

на внизу

, которые работают для меня!

источник

2014-04-03 03:40:04 jcmordan

это не имеет смысла, вам нужно добавить скрипты jquery. –

Я думаю Вероятно, jkarlos означал, что он дважды ссылался на jQuery. – Tony

yeap, то есть. – jcmordan

У меня также была аналогичная проблема, которая потребовала нескольких недель для отладки. Я использовал страницу aspx.

Основная причина в том, что Html.BeginForm заявление было размещено после <table> тега.

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

Это вызвало <form> тег, чтобы закрыть перед любым <input> тега, и, таким образом, проверка ненавязчивым клиент не работает.

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

Итак, не забудьте положить Html.BeginFormперед тем<table> теге

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

источник

2015-02-09 10:03:43

У меня была та же проблема, и обнаружил, что если я называю 'element.valid()' перед вызовом библиотеки для проверки работоспособности функции, чем она больше не будет проверять мою форму. Я решил это, создав расширение, которое проверяет, была ли форма обработана, и только, чтобы проверить, действителен ли элемент.

$.fn.revalidate = function() { 
     if (this.length) { 
      var validator = this.closest("form").data("validator"); 
      if (validator) 
       validator.element(this); 
     } 
     return this; 
    };

источник

2015-10-29 13:08:32

Ненавязчивая проверка стороны клиента в MVC4 не работает

ответ

Смежные вопросы