如何在jquery对话框中添加jquery tabcontrol，从其他jquery对话框打开，有一个tab控件

Question

我有一个包含jquery tabcontrol的jquery对话框表单。

＆＃13;

＆＃13;

  $(document).ready(function () {
        var dialog = $("#CreateForm").parentsUntil(".ui-dialog");
        dialog[0]["validateFilter"] = { ignore: "" };
        dialog[0]["formInvalidCallback"] = function () {
            $("#PersonTab").tabs("select", $("form .input-validation-error").closest(".ui-tabs-panel").get(0).id);
        };
        $(dialog).parent().find(".ui-dialog-content").addClass("dialog-content-nopadding");
        dialog.find("#PersonTab").tabs({
            "show": function (event, ui) {
                if (!$(dialog)[0].dragged)
                    dialog.dialog('option', 'position', 'center');
                var oTable = $('div.dataTables_scrollBody>table.display', ui.panel).dataTable();
                if (oTable.length > 0) {
                    oTable.fnAdjustColumnSizing();
                }
            }
        });
    });

＆＃13;

@using (Html.BeginForm(null, null, FormMethod.Post, new { id = "CreateForm" }))
{
    @Html.AntiForgeryToken()
    @Html.ValidationSummary(true)
    <fieldset style="min-width:550px">
        <div>
            <div id="PersonTab" class="tabs">
                <ul>
                    <li><a href="#General-tab">@Html.StaticText("Person_General_Tab")</a></li>
                    <li><a href="#PrefermentJob-tab">@Html.StaticText("JobTPerson_PrefermentJob_Tab")</a></li>
                    <li><a href="#JustifyJob-tab">@Html.StaticText("JobTPerson_JustifyJob_Tab")</a></li>
                </ul>
                <div id="General-tab">
                    @Html.Partial("Details")
                </div>


                <div id="PrefermentJob-tab">
                    @Html.Partial("PrefermentJobList")

                </div>
                <div id="JustifyJob-tab">
                    @Html.Partial("JustifyJobList")

                </div>
            </div>
        </div>
    </fieldset>
}

＆＃13;

＆＃13;

＆＃13;

This is output1

此tabcontrol打开另一个jquery对话框。新的jquery对话框有jquery tabcontrol本身。

＆＃13;

＆＃13;

    $(document).ready(function () {
        var dialog = $("#CreateJobForm").parentsUntil(".ui-dialog");
        dialog[0]["validateFilter"] = { ignore: "" };
        dialog[0]["formInvalidCallback"] = function () {
            $("#JobTab").tabs("select", $("form .input-validation-error").closest(".ui-tabs-panel").get(0).id);
        };
        $(dialog).parent().find(".ui-dialog-content").addClass("dialog-content-nopadding");
        dialog.find("#JobTab").tabs({
            "show": function (event, ui) {
                if (!$(dialog)[0].dragged)
                    dialog.dialog('option', 'position', 'center');
                var oTable = $('div.dataTables_scrollBody>table.display', ui.panel).dataTable();
                if (oTable.length > 0) {
                    oTable.fnAdjustColumnSizing();
                }
            }
        });
    });

＆＃13;

@using (Html.BeginForm(null, null, FormMethod.Post, new { id = "CreateJobForm" }))
{
    @Html.AntiForgeryToken()
    @Html.ValidationSummary(true)
    <fieldset style="min-width:550px">
        <div>
            <div id="JobTab" class="tabs">
                <ul >
                    <li><a href="#General-tab">@Html.StaticText("Job_General_Tab")</a></li>
                    <li><a href="#Education-tab">@Html.StaticText("Job_JobEducationList_Tab")</a></li>
                    <li><a href="#Indicator-tab">@Html.StaticText("Job_JobIndicatorList_Tab")</a></li>

                </ul>
                <div id="General-tab">
                    @Html.Partial("DetailsJob")
                </div>
                <div id="Education-tab">
                    @Html.Partial("JobEducationList")

                </div>
                <div id="Indicator-tab">
                    @Html.Partial("JobIndicatorList")

                </div>
            </div>
        </div>
    </fieldset>
}

＆＃13;

＆＃13;

＆＃13;

我的问题是新的jquery tabcontrol（第二个）没有实际行为。

this is output2

任何人都可以帮助我。 感谢。