Question

我想使用相同的jquery ui对话框进行多种用途。

在这种情况下，我在每一行都有一个带复选框的数据网格。用户可以通过按下按钮删除他检查的行（删除）。每当按下按钮时，会显示一个jquery ui对话框（确认框），其中包含您想要删除的消息？是或否

但是当没有选中复选框并且用户按下删除按钮时，我想在内容中显示具有不同标题和msg（没有选择行）的jquery ui对话框。我怎么能这样做？

目前我的代码如下：

 $(document).ready(function() {
            $( "#dialog" ).dialog({
                autoOpen: false,
                width:"400px",
                modal: true,
                resizable: true,
                buttons: [
                    {
                        text: "Yes",
                        click: function() {
                            $('#form_list_action').submit();
                        }
                    },
                    {
                        text: "Cancel",
                        click: function() {
                            $( this ).dialog( "close" );
                        }
                    }
                ]
            });
            $( "#action-delete" ).on('click', function(event) {
                event.preventDefault();
                $( "#dialog" ).dialog( "open" );

            });



<div id="dialog" title="Delete Selected Items">
 <p><span class="ui-icon ui-icon-alert" style="float: left; margin: 0 7px 20px 0;">   </span>These items will be permanently deleted and cannot be recovered. Are you sure?</p>
</div>

 <a href="" class="action-delete" id="action-delete">Delete</a>

Answer 1

我正在使用此功能在需要时动态创建一个对话框。

function showPopup(title,url,height,width,data,showCloseBtn)
{
    showCloseBtn = showCloseBtn || false;
    height = height || 'auto';
    width = width || 'auto';

    //Create popup container if needed or remove content
    if($('#popup').length == 0)
        $('body').append('<div id="popup"></div>');
    else
        $('#popup').empty();

    //Reset dialog widget if needed
    try{$('#popup').dialog('destroy');}catch(e){}

    if(showCloseBtn)
        btnCode = {"Fermer": function(){$( this ).dialog( "close" );}}
    else
        btnCode = null;

    //Load content if the data provided is html code
    if(url.search('<') >= 0)
    {
        $('#popup').html(url);
        $('#popup').dialog({
                resizable: false,
                modal: true,
                width: width,
                height : height,
                buttons:btnCode,
                title : title
            });        
    }
    else
    {
        var data = data || {};
        //Load data from url
        $('#popup').load(url,data,function(){
            $(this).dialog({
                resizable: false,
                modal: true,
                width: width,
                height : height,
                buttons:btnCode,
                title : title
            });        
        });                           
    }    
}

如何使用单个jquery ui对话框用于多种用途

1 个答案: