Question

我在asp.net mvc4和jQuery 2.1.4中使用对话框。我有像

这样的索引页面

@model IEnumerable<Osample.Models.Role_Privilege_Map>

@{
    ViewBag.Title = "RolePrivilgeMapping";
}

<script>

    $(document).ready(function () {

        registerEditDialogBox();

         $.ajaxSetup({ cache: false });

         function registerEditDialogBox() {
             $(".editRoleDialog").on("click", function (e) {
                 event.stopPropagation();
                 var url = $(this).attr('href');
                 var $this = $(this);
                 $("#dialog-edit").dialog({
                     title: 'Edit Role',
                     autoOpen: false,
                     resizable: false,
                     height: 150,
                     width: 400,
                     modal: true,
                     draggable: true,
                     open: function (event, ui) {
                         $(this).load(url);

                     },
                     close: function (event, ui) {
                        registerEditDialogBox();
                     }
                 });

                 $("#dialog-edit").dialog('open');
                 return false;
             });
         }
    });

</script>


<div id="heading">
    <h2>Role - Privilge Mapping</h2>
</div>

<div id="RolePrivilgeMappingWrapper">

    <div class="float-left" id="roleWrapper">
        @Html.Partial("_Role", sample.Models.DataProvider.DataProvider.GetRoleNames())
    </div>

</div>

我的角色部分页面是

@model IEnumerable<sample.Models.webpages_Roles>

@{
    ViewBag.Title = "Index";
}

<div class="settingsTable" style="position: relative; width: 100%; margin: 0 auto">

    <div style="width: 50%; margin: 0 auto">
        <div style="width: 50%; margin: 0 auto">
            <h2>Role</h2>
        </div>
    </div>

    <p>
        @Html.ActionLink("Create New Role", "OpenAddRoleDialog", "RolePrivilegeMapping", null, new { @class = "createRole actionHyperLink" })
    </p>
    <table id="tblRole">
        <tr>
            <th>Role ID</th>
            <th>
                @Html.DisplayNameFor(model => model.RoleName)
            </th>
            <th>Action</th>
        </tr>

        @foreach (var item in Model)
        {
            <tr>
                <td>
                    @Html.DisplayFor(modelItem => item.RoleId)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.RoleName)
                </td>
                <td>
                    @Html.ActionLink("Edit", "OpenEditRoleDialog", "RolePrivilegeMapping", new { id = item.RoleId }, new { @class = "editRoleDialog actionHyperLink" }) |
                    @Html.ActionLink("Delete", "DeleteRole", "RolePrivilegeMapping", new { id = item.RoleId }, new { @class = "confirmDialog actionHyperLink" }) 
                </td>
            </tr>
        }
    </table>

    <div id="dialog-edit" style="display: none">
    </div>

</div>

我的编辑角色部分页面是

@model sample.Models.webpages_Roles


    @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/bundles/jqueryui")
    @Scripts.Render("~/bundles/jqueryval")


    @Styles.Render("~/Content/css")
    @Styles.Render("~/Content/jqueryUI")

<script type="text/javascript">


    $.validator.unobtrusive.parse(document);

    function roleEditSuccess() {

       // $("#dialog-edit").dialog('close');
    }

</script>
@using (Ajax.BeginForm("EditRole", "RolePrivilegeMapping", 
    new AjaxOptions { HttpMethod = "POST",UpdateTargetId="roleWrapper",OnSuccess="roleEditSuccess" }))
{
    @Html.ValidationSummary(true)

    <fieldset>
        <legend>webpages_Roles</legend>

        @Html.HiddenFor(model => model.RoleId)

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

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

所以流程就像

索引加载了角色
角色表正在编辑操作链接
单击编辑时，将打开jquery对话框并显示编辑页面
保存详细信息时使用

UpdateTargetId = “roleWrapper”

因为角色div的部分更新，当对话框关闭时我再次应用jquery对话框插件，但是出现以下错误

“错误：在初始化之前无法调用对话框上的方法; 试图调用方法'open'“

如何前进。我的问题很严重。

部分更新div后运行js脚本

0 个答案: