ASP.Net MVC 2 - проверка jQuery и отправка формы - DataAnnotations

Question

У меня есть пример приложения, пытающегося изучить проверку jQuery и отправить форму в этом сценарии.

На странице есть одно текстовое поле (EnvelopeID для каждого класса Envelope).Если нажать кнопку «Отправить» и текстовое поле пусто, я хочу показать сообщение об ошибке.Если он не пустой, то я хочу опубликовать ajax-запрос в GetData Action.Действие возвращает частичные представления (значение 1 или 2) или строку ошибки.

Проблема:

1. Проверка клиента здесь не происходит.
2. Как я могу заставить $(form).submit придерживаться проверки jquery и не публиковать данные, если они пусты?Я могу проверить, является ли текстовое поле пустым или нет перед публикацией (вручную), но я хочу использовать правильный способ.

Этот же самый пример работает с MSAjax и проверкой без проблем.

Заголовок главной страницы

<script type="text/javascript" src="<%= Url.Content("~/Scripts/jquery-1.4.1.min.js") %>"></script>
<script type="text/javascript" src="<%= Url.Content("~/Scripts/jquery.validate.min.js") %>"></script>
<script type="text/javascript" src="<%= Url.Content("~/Scripts/MicrosoftMvcJQueryValidation.js") %>"></script>

Класс:

namespace PartialViews.Models
    {
        public class Envelope
        {
            [Required(ErrorMessage="Envelope ID is required!")]
            public string EnvelopeID { get; set; }
        }
    }

Действие данных:

[HttpPost]
public ActionResult GetData(Envelope envelope)
{
    ActionResult result = null;
    if (ModelState.IsValid)
    {
        Information myInfo = newInformation();
        if (envelope.EnvelopeID == "1")
        {
            result = View("TQ1PV", myInfo); //partial view
        }
        elseif (envelope.EnvelopeID == "2")
        {
            result = View("TQ2PV", myInfo); //partial view
        }
        else
        {
            result = Content("Error");
        }
    }
    else
    {
        result = View("index", envelope);
    }
    return result;
}

Индекс Действие:

public Action Result Index()
{
    return View();
}

JS при просмотре - Индекс

<script type="text/javascript">
    $(function () {
        //onload 
        $("#evid").focus();
        $("form[name='EVIDForm']").submit(function () {
            var action = $(this).attr('action');
            var evid = $("#evid").val();
            var tdata = $(this).serialize();
            alert(tdata);
            $message = $("#resultDiv");
            $message.html('').removeClass("red");
            $.ajax({
          cache: false, 
          type: "post",
          url: action,
          data: tdata,
          dataType: "html",
          error: function (xhr, ajaxOptions, thrownError){ 
                    alert('system error');
                },
                success: function(data){
           if (data == 'Error')
                        $message.html("No such EV ID found!").addClass("red");
                    else
                        $message.html(data);
          }
         });
            return false;
        });
    });

</script>

HTML при просмотре -Индекс:

    <% Html.EnableClientValidation(); %>
    <%= Html.ValidationSummary() %>

    <% using (Html.BeginForm("GetData", "Info", FormMethod.Post, new {name = "EVIDForm" }))
       {%>
       <%= Html.LabelFor(model => model.EnvelopeID) %> &nbsp;&nbsp;
       <%= Html.TextBoxFor(model => model.EnvelopeID, new { maxlength = "8"})%>
       <%= Html.ValidationMessageFor(model => model.EnvelopeID,"*") %>
       <br /><br />


        Correct EVIDs are 1 and 2. All other entries will result in an error.
        <br /><br />
        <input type="submit" value="submit" />
    <%} %>
    <div id="resultDiv" style="margin-top: 20px;"></div>

Спасибо

Answer 1

<% с использованием (Html.BeginForm («Зарегистрироваться», «Пользователь», FormMethod.Post, new {id = "RegisterForm"})) </p>

 $("#RegisterForm").validate({

            rules: {
                ignore: ":not(:visible)",
                EmailAddress: {
                    required: true,
                    email: true
                },
                ConfirmEmailAddress: {
                    required: true,
                    email: true,
                    equalTo: "#EmailAddress"
                },
                Password: {
                    required: true
                },
                ConfirmPassword: {
                    required: true,
                    equalTo: "#Password"
                }
            },
            messages: {
                EmailAddress: {
                    required: " Email Address is required",
                    email: " Email Address is invalid"
                },
                ConfirmEmailAddress: {
                    required: " Email Address is required",
                    email: " Email Address is invalid",
                    equalTo: "Enter Email Address same as above"
                },
                Password: {
                    required: " Password is required"
                },
                ConfirmPassword: {
                    required: " Password is required",
                    equalTo: " Enter Confirm Password same as above"
                }
            }
        });

Answer 2

http://geekswithblogs.net/stun/archive/2010/02/27/asp.net-mvc-client-side-validation-summary-with-jquery-validation-plugin.aspx

И если вы хотите увидеть полный javascript, моя версия опубликована в вопросе, который я отправил jquery.validate потерян при замене ajax и показывает только последнюю ошибку

Это способ заставить его работать со сводной информацией о проверке, но, возможно, это поможет вам разобраться в вашей проблеме.Я знаю, что если вы ссылаетесь на javascript проверки Microsoft и javascript-файлы проверки jquery, они будут вызывать проблемы друг с другом.

Answer 3

Возможно, вы можете использовать это для проверки всех полей ввода:

Простая, но мощная проверка формы jquery

С уважением ...

Answer 4

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