阿贾克斯在MVC AsP.net发布形式(验证)?形式、MVC、阿贾克斯、net

2023-09-10 20:35:15 作者:后会无期

所以,我有一个网页,有它的一些形式和那些形式之一是一个用于地址,其中有三个功能。另存为新的,更新和删除。我想用form.submit()火在客户端和服务器端的MVC的验证,但我不想整个页面刷新。

So I have a page that have a few forms on it and one of those forms is a one for addresses which has three functions. Save as new, Update and Delete. I want to use form.submit() to fire the MVC validation on the client and server side but I dont want the entire page refresh.

所以这是我想根据我的属性型号和用途使用简单form.submit()收集的元素,并将其作为模型发送到ASP.net MVC控制器和处理验证一个回调来处理JSON响应仅更新受影响的区域。

So this is what I want to use the simple form.submit() to gather the elements and send it to the ASP.net MVC controller as a model and handle the validation based on the attributes I have on the model and use a callback to handle a JSON response to update only the affected area.

我知道我可以使用jQuery创建一个Ajax post请求,但我将不得不处理所有的事情,即绑定到视图模型,验证和创建请求本身。有反正我能得到最好的两个方法?

I know I could use jQuery to create an AJAX post request but I would have to handle everything, i.e. bind to the viewmodel, validation and create the request itself. Is there anyway I can get the best of both methods?

推荐答案

在MVC中,一旦你验证使用的DataAnnotations模型数据属性,你已经完成了与服务器端验证,然后你可以用 jQuery.validation库来验证的客户端。

In MVC, once you validate Model data using DataAnnotations attributes you have already done with server side validation and then you can use jQuery.validation library to validate on client side.

在这里,您可以使用,你使用的DataAnnotations验证与阿贾克斯后Ajax.BeginForm职务。

Here you can use Ajax.BeginForm post where you utilize DataAnnotations validation with ajax post.

的DataAnnotations属性

   public class Movie {
    public int ID { get; set; }

    [Required]
    public string Title { get; set; }

    [DataType(DataType.Date)]
    public DateTime ReleaseDate { get; set; }

    [Required]
    public string Genre { get; set; }

    [Range(1, 100)]
    [DataType(DataType.Currency)]
    public decimal Price { get; set; }

    [StringLength(5)]
    public string Rating { get; set; }
}

jQuery.validation库

 <script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")" type="text/javascript"></script>    
<script src="@Url.Content("~/Scripts/jquery.validate.js")" type="text/javascript"></script>    
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.js")" type="text/javascript"></script>

表格与验证

@using (Ajax.BeginForm(new AjaxOptions { UpdateTargetId = "result" }))
   {
        <fieldset>
            <legend>Movie</legend>

            <div class="editor-label">
                @Html.LabelFor(model => model.Title)
            </div>
            <div class="editor-field">
                @Html.EditorFor(model => model.Title)
                @Html.ValidationMessageFor(model => model.Title)
            </div>

            <div class="editor-label">
                @Html.LabelFor(model => model.ReleaseDate)
            </div>
            <div class="editor-field">
                @Html.EditorFor(model => model.ReleaseDate)
                @Html.ValidationMessageFor(model => model.ReleaseDate)
            </div>

            <div class="editor-label">
                @Html.LabelFor(model => model.Genre)
            </div>
            <div class="editor-field">
                @Html.EditorFor(model => model.Genre)
                @Html.ValidationMessageFor(model => model.Genre)
            </div>

            <div class="editor-label">
                @Html.LabelFor(model => model.Price)
            </div>
            <div class="editor-field">
                @Html.EditorFor(model => model.Price)
                @Html.ValidationMessageFor(model => model.Price)
            </div>
            <div class="editor-label">
        @Html.LabelFor(model => model.Rating)
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.Rating)
        @Html.ValidationMessageFor(model => model.Rating)
    </div>
            <p>
                <input type="submit" value="Create" />
            </p>
        </fieldset>
    }

资源:http://www.asp.net/mvc/tutorials/mvc-4/getting-started-with-aspnet-mvc4/adding-validation-to-the-model