2012-06-17 4 views
0

В моем приложении MVC4 я пытаюсь создать валидатор на стороне клиента для некоторых текстовых полей в форме. Форма содержится в представлении Register.cshtml (это представление автоматически создается VS2010, когда я создаю новый MVC4 с проектом formauthentication).javascript validate not working in mvc app

Форма уже реализует проверку на кнопке Submit, но я хочу, чтобы валидатор, который действует, как только фокус покидает текстовое поле, должен показать мне встроенную ошибку рядом с текстовым полем с красным шрифтом. если он подтвержден в порядке, он должен снова показать сообщение «ok».

Проблема: Валидатор .js не работает. Firebug говорит:

$ document не определен. $ document.ready (

Я также попытался предупреждение(), если я поместить его вне document.ready функции, она появляется, когда внутри, оно не поп код для registerForm.js:..

$document.ready(
function() 
{ 
    $('#registration form').validate 
    (
     { 
      rules: 
      { 
       UserName: { required: true } 
      }, 
      success: function (label) 
      { 
       label.Text('OK!').addClass('IsInputValid'); 
      } 
     } 
    ) 
} 
); 

расслоение, который добавляет этот браузер следующим образом:

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

Наконец, вид:

<div id="registration"> 
@using (Html.BeginForm()) { 
@Html.ValidationSummary() 

<fieldset> 
    <legend>Registration Form</legend> 
    <ol> 
     <li> 
      @Html.LabelFor(m => m.UserName) 
      @Html.TextBoxFor(m => m.UserName) 
     </li> 
     <li> 
      @Html.LabelFor(m => m.Email) 
      @Html.TextBoxFor(m => m.Email) 
     </li> 
     <li> 
      @Html.LabelFor(m => m.Password) 
      @Html.PasswordFor(m => m.Password) 
     </li> 
     <li> 
      @Html.LabelFor(m => m.ConfirmPassword) 
      @Html.PasswordFor(m => m.ConfirmPassword) 
     </li> 
    </ol> 
    <input type="submit" value="Register" /> 
</fieldset> 
} 
</div> 

@section Scripts { 
@Scripts.Render("~/bundles/jqueryval") 
} 

Что может помешать работе js? Я уже потратил около 5 часов, пытаясь понять это. Пожалуйста, дайте мне знать, если у вас есть какие-либо предложения,

С уважением,

+0

Вы прочитали сообщение? – SLaks

ответ

1
@Html.TextBoxFor(m => m.UserName, new { @class = "required" }) 

Нет необходимости в JS здесь. И то, что все остальные говорят о $ document, не является правильным синтаксисом, если у вас нет var $document = $(document) где-то определен.

+0

спасибо за объяснение, не знаю, как я пропустил круглую скобку по ключевому слову документа. теперь я экспериментирую с вашим кодом, чтобы увидеть, как я могу помещать сообщения об ошибках inline вместо validationSummary. Еще раз спасибо –

+0

нашел, что мне нужно для моего первоначального вопроса (действует, как только фокус покидает текстовое поле) - событие размытия. –

1

Вы должны использовать JQuery оболочку для объекта документа:

$(document).ready(function() { 
    // your function 
}); 
1

Определен ли $document? jQuery определяет объект $. Вы можете использовать этот объект как функцию и передать его селектор, включая document и призови .ready() на том, что:

$(document).ready(someFunction);