多個區塊動態驗證

[rusli]

簡單說明

[rusli]

代碼: 選擇全部

using System.ComponentModel;
using System.ComponentModel.DataAnnotations;

public class ValidationModel
{
    [Required]
    [DisplayName("User name")]
    public string UserName { get; set; }

    public string Id { get; set; }
    public string Status { get; set; }

    public ValidationModel(string id)
    {
        Id = id;
        UserName = string.Empty;
        Status = string.Empty;
    }

    public ValidationModel()
    {
    }
}


[rusli]

代碼: 選擇全部

using System.Web.Mvc;
using System.Collections.Generic;
using System.Linq;

namespace DynamicMultiFormValidation.Controllers
{
    [HandleError]
    public class HomeController : Controller
    {
        private static IList<ValidationModel> listModel = new List<ValidationModel>();
        public ActionResult Index()
        {
            listModel.Add(new ValidationModel((listModel.Count()).ToString()));
            return View(listModel);
        }

        [HttpPost]
        public ActionResult Index(ValidationModel m)
        {
            m.Status = "成功!";

            //// Server 再次驗證,萬一IE不支援或關閉JS
            if (!ModelState.IsValid)
            {
                m.Status = "失敗!";
            }

            IList<ValidationModel> lm = listModel.Where(x => x.Id.Equals(m.Id)).ToList();
            if (lm.Count > 0)
            {
                lm[0].UserName = m.UserName;
                lm[0].Status = m.Status;
            }
            return View("FormView", m);
        }

        public ActionResult LoadById(string id)
        {
            IList<ValidationModel> lm = listModel.Where(x => x.Id.Equals(id)).ToList();
            return View("FormView", lm.Count > 0 ? lm[0] : new ValidationModel(listModel.Count().ToString()));
        }
    }
}


[rusli]

代碼: 選擇全部

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<ValidationModel>" %>


 <script language="javascript" type="text/javascript">
 
     function OnLoadAllViewsComplete<%=Model.Id%>(data) {
        $("#MyResultView<%=Model.Id%>").each(function() { $(this).html(data); });
    }

    function onSaveComplete<%=Model.Id%>(data) {
        $("#MyResultView<%=Model.Id%>").jRefreshViews({
            PostUrl: '<%= Url.Action("LoadById", "Home") %>'
            , ExtensionParams: { id: "<%=Model.Id%>" }
            , OnComplete: OnLoadAllViewsComplete<%=Model.Id%>
        });
    }
 </script>
 
  <%
        Html.EnableClientValidation();
        using (Ajax.BeginForm("Index", "Home", null, new AjaxOptions()
                                                                    {
                                                                        InsertionMode = InsertionMode.Replace,
                                                                        OnComplete = "onSaveComplete" + Model.Id,
                                                                        HttpMethod = "POST"
                                                                    }, new { id = "MyForm" + Model.Id }))
        {
    %>
        <%=Html.HiddenFor(m=>m.Id) %>
        <%=Html.LabelFor(m=>m.UserName) %><br />
        <%=Html.TextBoxFor(m => m.UserName)%><br />
        <%=Html.ValidationMessageFor(m => m.UserName, "", new { id = "UserName" + Model.Id })%><br />

        <input type="submit" value="Save" />
 <%     }%>
  <div>狀態:<%=Model.Status%></div>
  <hr />
 
 
 <script language="javascript" type="text/javascript">

     $().ready(function() {

     //// 必須引用 MicrosoftMvcJQueryValidation.js
         var allFormOptions = window.mvcClientValidationMetadata;
         if (allFormOptions) {
             while (allFormOptions.length > 0) {
                 var thisFormOptions = allFormOptions.pop();
                 __MVC_EnableClientValidation(thisFormOptions);
             }
         }

         $("#MyForm<%=Model.Id%>").validate();
     });
 </script>


[rusli]

代碼: 選擇全部

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<IList<ValidationModel>>" %>
<%
    foreach(ValidationModel m in Model)
    {
       %>
           <div id="MyResultView<%=m.Id %>">
             <%Html.RenderPartial("FormView", m); %>     
           </div>
       <%
    }
%>


[rusli]

代碼: 選擇全部

<%@ Page Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<IList<ValidationModel>>" %>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
  <div id="MyResultView">
    <%Html.RenderPartial("MainFormView", Model); %>     
  </div>
</asp:Content>


[rusli]

代碼: 選擇全部

/*
* jQuery jRefreshViews - RefreshViews plugin - v 1.0.0
*
* Copyright (c) 1980-2010 Rusli <http://nothing.com.tw>
* Licensed under the MIT License:
* http://www.opensource.org/licenses/mit-license.php
*/
(function($) {
    $.fn.jRefreshViews = function(options) {
        var version = '1.0.0';

        // options
        var opts = $.extend({}, $.fn.jRefreshViews.defaults, options);

        return this.each(function() {
            $this = $(this);
            $this.PostUrl = null;
            $this.OnComplete = null;
            $this.ExtensionParams = null;

            var o = $.meta ? $.extend({}, opts, $this.data()) : opts;

            $this.PostUrl = o.PostUrl;
            $this.ExtensionParams = o.ExtensionParams;
            $this.OnComplete = o.OnComplete;
            $.fn.jRefreshViews.RefreshBlock($this);
        });
    };

    //指定的更新畫面區塊
    $.fn.jRefreshViews.RefreshBlock = function(el) {
        var url = el.PostUrl;
        $.post(url, el.ExtensionParams, $this.OnComplete);
    }

    $.fn.jRefreshViews.defaults = {
        PostUrl: '/{Contoller}/{Action}'
            , ExtensionParams: { block: 'LabelQuickList' /* your Action block */, params1: '' /* your other value*/ }
            , OnComplete: function() { return false; } /* your complete funciton */
    };

})(jQuery);