3

我有一个在 jQuery UI 对话框中呈现的局部视图。因为它是动态内容,所以不显眼的客户端验证是行不通的。为了得到它,我必须强制验证器解析表单的内容调用$.validator.unobtrusive.parse();。但它不起作用。我的浏览器报告未定义不显眼的对象。为什么会这样?也许 jQuery 库中有一些变化,现在整个事情的工作方式不同了。我正在使用 jquery-1.6

4

2 回答 2

6

您可能会发现以下博客文章很有用。

于 2011-05-23T21:20:52.963 回答
0
    (function($){

        CampusCommon.register("Campus.UI.Popup")
        Campus.UI.Popup=function(){
            defaults={
                action:'',
                ispartialaction:'',
                customcallback:'',
                confirmaction:'',
                controltoupdateid:'',
                width:500,
                title:'',
                onsubmit:function(id){
                    var popupid=id+"_popupholder";
                    if(this.ispartialaction){
                        $.ajax({
                            url:this.action,
                            type:"Get",
                            context: this,
                            data:$(this).find("form").serialize(),
                            success:function(data){
                                $('#'+id).parents('body').find('form').append("<div id='"+popupid+"'></div>");
                                var ajaxContext=this;
                                $("#"+popupid).dialog({
                                    autoopen:false,
                                    model:true,
                                    width:this.width,
                                    title:this.title,
                                    buttons:{
                                        "Confirm":function(){
                                            if(ajaxContext.customcallback==''){
                                                var popupform=$(this).find("form");
                                                if(popupform.valid()){
                                                    $.post(ajaxContext.confirmaction,popupform.serialize(),function(d){
                                                        if(d!='')
                                                        {
                                                            $.each(d,function(i,j){
                                                                switch(j.Operation)
                                                                {
                                                                    case 1:
                                                                        if($('#'+j.ControlClientID).is("select"))
                                                                        {
                                                                            $('#'+j.ControlClientID).val(j.Value);
                                                                            $('#'+j.ControlClientID).change();
                                                                        }
                                                                        else if($('input[name="'+j.ControlClientID+'"]').length>0)
                                                                        {
                                                                            $('input[name="'+j.ControlClientID+'"][value="'+j.Value+'"]').prop("checked",true);
                                                                        }
                                                                        break;
                                                                    case 2:
                                                                        if($('#'+j.ControlClientID).is("select"))
                                                                        {
                                                                            $('#'+j.ControlClientID).append("<option selected='selected' value=\""+j.Value+"\">"+j.Text+"</option>");
                                                                        }
                                                                        else
                                                                        {
                                                                            var len=$('input[name="'+j.ControlClientID+'"]').length;
                                                                            $('#'+j.ControlClientID+"list").append('<li><input type="checkbox" name="'+j.ControlClientID+'" value="'+j.Value+'" id="ae'+j.ControlClientID+len+'"/><label for "ae'+j.ControlClientID+len+'">'+j.Text+'</label>');
                                                                        }
                                                                        break;
                                                                    case 0:
                                                                        $('#'+j.ControlClientID).val(j.Value);
                                                                        breakl
                                                                    default:break;
                                                                }
                                                            });                                                                     

                                                            popupform.parent().dialog("destroy").remove();
                                                            $("#"+ajaxContext.controltoupdateid).change();
                                                        }
                                                    });
                                                }
                                            }
                                            else
                                            {
                                                executeByFunctionName(ajaxContext.customcallback,window,new Array());
                                            }
                                        },
                                        "Cancel":function(){
                                            $(this).dialog("close");
                                        }
                                    }
                                });
                                $("#"+popupid).dialog("open");
                                $("#"+popupid).empty().append(data);
                            },
                            error:function(e)
                            {
                                alert(e);
                            }
                        });
                    }
                    else
                    {
                        var frm=document.createElement("form");
                        frm.id="CampusForm";
                        frm.name="CampusForm";
                        frm.action=this.action;
                        frm.method="post";
                        var arr=$($("#"+id).closest("body").find("form")).serializeArray();
                        $.each(arr,function(i,j){
                            var hidd=document.createElement("input");
                            hidd.type="hidden";
                            hidd.name=j.name;
                            hidd.value=j.value;
                            frm.appendChild(hidd);});
                        document.appendChild(frm);
                        frm.submit();
                    }
                }
            },
            clicksubmit=function(){
                var opts=$(this).data("CampusPopup");
                opts.onsubmit($(this).attr("id"));
                return false;
            };
            return        {
                init:function(opt){
                    var opts=$.extend({},defaults,opt||{});
                    $(this).data('CampusPopup',opts);
                    $(this).bind("click",clicksubmit);
                }};
        }();
        $.fn.extend({CampusPopup:Campus.UI.Popup.init});
    })(jQuery)


    /*js*/
    1.7.1,1.5.1,validate,unobtrusive,8.20,common,popup.js



     [HttpGet]
            public ActionResult AddCourse(ViewModel.Batch batch)
            {
                return PartialView("~/Views/Admin/Course.cshtml", new ViewModel.Course());
            }

/*Layout*/
<script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/jquery-1.7.1.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/campuscommon.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/campus.ui.popup.js")" type="text/javascript"></script>    
    <script src="@Url.Content("~/Scripts/jquery.validate.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>


/*Batch*/
@model Campus.UI.Admin.Models.Batch

@{
    ViewBag.Title = "Batch";
}

<h2>Batch</h2>

@using (Html.BeginForm(Model.SubmitAction,Model.SubmitController)) {
    ViewContext.FormContext.ValidationSummaryId = "valSumId";
    @Html.ValidationSummary(false, "Please fix these errors.", new Dictionary<string, object> { { "id", "valSumId" } });

    <fieldset>
        <legend>Batch</legend>

        <div class="editor-label">
            @Html.LabelFor(model => model.BatchName)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.BatchName)            
        </div>
        <div class="editor-label">
            @Html.LabelFor(model => model.Courses)
        </div>
        <div class="editor-field">
            @Html.DropDownListFor(model => model.CourseId,Model.Courses,"--Select a course")         
        </div>
        <div class="editor-label">
            @Html.LabelFor(model => model.BatchDescription)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.BatchDescription)            
        </div>

        <p>
            <input type="submit" value="Create" />
        </p>
    </fieldset>
}


@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
    @Scripts.Render("~/bundles/jqueryui")
    @Styles.Render("~/Content/themes/base/css")
}


/*Course*/
@model Campus.UI.Admin.Models.Course
@{
    ViewBag.Title = "Course";
}

<h2>Course</h2>

@using (Html.BeginForm()) {
    ViewContext.FormContext.ValidationSummaryId = "valSumId";
    @Html.ValidationSummary(false, "Please fix these errors.", new Dictionary<string, object> { { "id", "valSumId" } });

    <fieldset>
        <legend>Course</legend>

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

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

        <p>
            <input type="submit" value="Create" />
        </p>
    </fieldset>
}

<div>
    @Html.ActionLink("Back to List", "Index")
</div>

@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
}
于 2014-03-03T17:41:13.637 回答