在编辑/添加对话框jqGrid前面打开jQuery UI对话框

Question

我costomize编辑/添加对话框jqGrid。在“beforeShowForm”事件中，我添加了按钮和字段。按下按钮后，有一个jqUi对话框。我可以实现新的jQuery UI对话框的打开，但是在编辑/添加对话框jqGrid后面打开。如何在编辑/添加对话框jqGrid前面打开它？

这是我的代码：

var gridWidth = 1000,
    gridHeight = 600;

var pagerSettings = {
    add: true,
    addtext: "Добавить",
    edit: true,
    edittext: "Редактировать",
    del: true,
    deltext: "Удалить",
    search: false,
    refresh: false
};
var editSettings = {
    closeAfterEdit: true,
};
var addSettings = {
    closeAfterAdd: true,
    closeOnEscape: true
};
var searchSettings =
    deleteSettings = {
        closeOnEscape: true
    };

function CustomForm(form) {
    AddSelector(form);
    AddButtons(form);
};

function AddSelector(form) {
    var nameColumnField = $('#tr_WebUri', form).show();
    var tr = $('<tr />', { class: "FormData", id: "tr_ActivitiesID" });
    var td_row_one = $('<td />', { class: "CaptionTD" }).appendTo(tr);
    var td_row_two = $('<td />', { class: "DataTD" }).appendTo(tr);
    var sel = $('<select />', { id: "ActivitiesID", multiple: "multiple" }).appendTo(td_row_two);
    tr.insertAfter(nameColumnField);

    $("#ActivitiesID").multiselect({
        autoOpen: false
    }).multiselectfilter();
};

function AddButtons(form) {
    var arr = [
                { id: "CitiesID", text: "Cправочник населенных пунктов" },
                { id: "ActivitiesID", text: "Cправочник видов деятельности" }
    ];
    $.each(arr, function (i, val) {
        var nameColumnField = $('#tr_' + val.id, form).show();
        var tr = $('<tr />', { class: "FormData", id: "tr_" + val.id + "Button" });
        var td_row_one = $('<td />', { class: "CaptionTD" }).appendTo(tr);
        var td_row_two = $('<td />', { class: "DataTD" }).appendTo(tr);
        $('<div />', { id: val.id + "Dialog", title: val.text }).appendTo($('body:first'));
        $('<Button />', { id: val.id + "Button", text: val.text }).button().click(function () {
            $("#" + val.id + "Dialog").dialog({                    
                modal: true,                    
                buttons: {
                    Ok: function () {
                        $(this).dialog("close");
                    }
                }
            }).css('zIndex', 1000);                
        }).appendTo(td_row_two);
        tr.insertAfter(nameColumnField);
    });
};

// Основная таблица:
$('#objectsMap').jqGrid({
    type: "GET",
    datatype: "json",
    url: "/Map/GetOrganizations",
    editurl: "/Map/EditOrganizations",
    colNames: new Array('ID', 'Наименование*', 'Номер', 'Адрес*', 'Населенный пункт', 'Телефон', 'Сайт', 'Дополнительно'),
    colModel: new Array(
                { name: 'ID', key: true, width: 50 },
                { name: 'Name', editable: true, editrules: { required: true } },
                { name: 'Number', editable: true, formoptions: { elmsuffix: $('<p />').text('номер по реестру, код таможенного органа').css('margin', '2px 5px') } },
                { name: 'Address', editable: true, editrules: { required: true }, formoptions: { elmsuffix: $('<p />').text('улица, дом, корпус, строение, офис').css('margin', '2px 5px') } },
                {
                    name: 'CitiesID', editable: true, edittype: 'select',
                    editoptions: {
                        defaultValue: 2,
                        value: function () {
                            var cities = new Object();
                            $.ajax({
                                url: "/Map/GetCities",
                                dataType: "json",
                                async: false,
                                success: function (data) {
                                    $.each(data.rows, function (index, item) {
                                        cities[item.cell[0]] = item.cell[1];
                                    });
                                }
                            });
                            return cities;
                        }
                    }
                },
                {
                    name: 'Phone', editable: true,
                    editoptions: {
                        dataInit: function (item) {
                            $(item).attr('placeholder', '+7 (812) 702-60-65');
                        }
                    }
                },
                {
                    name: 'WebUri', editable: true, editrules: { url: true },
                    editoptions: {
                        dataInit: function (item) {
                            $(item).attr('placeholder', 'http://rlp.su');
                        }
                    }
                },
                {
                    name: 'Additionally', editable: true, edittype: 'textarea',
                    editoptions: {
                        rows: "3", cols: "56"
                    }
                }
    ),
    toolbar: [true, "top"],
    sortname: 'Name',
    viewrecords: true,
    rownumbers: true,
    sortorder: "desc",
    width: gridWidth,
    height: gridHeight,
    pager: '#objectsMapPager',
    caption: "Справочник организаций"
}).jqGrid('navGrid', '#objectsMapPager', pagerSettings,
            // Edit
            {
                recreateForm: true,
                beforeShowForm: function (form) {
                    CustomForm(form);                        
                }
            },
            // Add
            {
                recreateForm: true,
                beforeShowForm: function (form) {
                    CustomForm(form);                        
                }
            },
            // Delete
            deleteSettings,
            // Search
            searchSettings
);
//$('#objectsMap').jqGrid('filterToolbar');