标签: jquery-ui-dialog

我正在开发一个ASP.Net MVC网站,在其上我列出了一个表格中的数据库查询ActionLink的预订,其中取消了特定行上的预订,具体BookingId如下:

我的预订

<table cellspacing="3">
    <thead>
        <tr style="font-weight: bold;">
            <td>Date</td>
            <td>Time</td>
            <td>Seats</td>      
            <td></td>              
            <td></td>
        </tr>
    </thead>            
    <tr>
        <td style="width: 120px;">2008-12-27</td>
        <td style="width: 120px;">13:00 - 14:00</td>
        <td style="width: 100px;">2</td>
        <td style="width: 60px;"><a href="/Booking.aspx/Cancel/15">cancel</a></td>
        <td style="width: 80px;"><a href="/Booking.aspx/Change/15">change</a></td>
    </tr>            
    <tr>
        <td style="width: 120px;">2008-12-27</td>
        <td style="width: 120px;">15:00 - 16:00</td>
        <td style="width: 100px;">3</td>
        <td style="width: 60px;"><a href="/Booking.aspx/Cancel/10">cancel</a></td>
        <td style="width: 80px;"><a href="/Booking.aspx/Change/10">change</a></td>
    </tr>  
</table>

如果我可以使用jQuery Dialog弹出一条消息,询问用户是否确定要取消预订,那将会是一件好事.我一直在努力让这个工作,但我一直在坚持如何创建一个接受参数的jQuery函数,以便我可以替换

<a href="/Booking.aspx/Cancel/10">cancel</a>

同

<a href="#" onclick="ShowDialog(10)">cancel</a>.

ShowDialog然后该函数将打开对话框并将参数10传递给对话框,这样如果用户单击是,那么它将发布href:/Booking.aspx/Change/10

我在这样的脚本中创建了jQuery …

我有一个问题jquery-ui dialog box.

问题是,当我关闭对话框然后单击触发它的链接时,除非我刷新页面,否则它不会再次弹出.

如何在不刷新实际页面的情况下调用对话框.

以下是我的代码:

$(document).ready(function() {
    $('#showTerms').click(function()
    {
        $('#terms').css('display','inline');
        $('#terms').dialog({
            resizable: false,
            modal: true,
            width: 400,
            height: 450,
            overlay: { backgroundColor: "#000", opacity: 0.5 },
            buttons:{ "Close": function() { $(this).dialog("close"); } },
            close: function(ev, ui) { $(this).remove(); },
    }); 
});

谢谢

可能重复:
加载回调后jQuery ui对话框更改标题

我在此UI对话框中提交表单后,我想更改UI对话框中的标题.所以在load我应该建议之后的回调函数中,但是我已经尝试过google而没有结果.

如何在不使用关闭按钮的情况下关闭对话框中的jQuery Dialog？

在ui对话框内部是一个简单的表单请求,如果发生成功提交,则ui对话框会自动关闭并刷新父页面.

    <script type="text/javascript">
        $(document).ready(function () {
            $("#form-dialog").dialog({
                autoOpen: true,
                modal: true,
                width: 200,
                draggable: true,
                resizable: true
            });
        });
    </script>


    <div id="form-dialog" title="Form Submit">
    <form action="default.aspx" method="post">
    <input type="text" name="name" value=" " />    
    <input type="submit" value="submit" />

    <a href="#" id="btnDone">CLOSE</a>

    <script type="text/javascript">
    $(document).ready(function () {
        $("#btnDone").click(function () {
            $(this).dialog('close');
        });
    });
    </script>

    </form>
    </div>

-imperialx

我有一个小问题.我试图抓住窗口的OnUnLoad事件并询问确认问题,如果用户决定他们想要保持那么好,如果他们想离开页面,那么他们将丢失所有未保存的数据.这是问题......

我正在使用jQuery UI对话框,当我在页面上放置以下代码时,我打开了Dialog,当我单击浏览器上的后退按钮时,它永远不会弹出msgbox.它只刷新页面:

<script type="text/javascript"> 
    $(window).bind('beforeunload', function() { 
            alert('you are an idiot!'); 
        } 
    );
</script>

我正在使用的解决方案是这里的帖子.再次,如果我没有打开jQuery UI对话框,msgbox将显示正常.如果我这样做,那么它不会显示msgbox并只刷新页面.

有任何想法吗？

任何人都可以告诉我如何在jQuery UI对话框中使用按钮文本的变量？我想创建一个动态按钮名称.

我想使用instance方法来测试jQuery UI Dialog小部件是否已经初始化.关于API,这是可能的,但它对我不起作用:

Uncaught Error: cannot call methods on dialog prior to initialization; attempted to call method 'instance'

演示:http://jsfiddle.net/mDbV7/

更新:

这是文档中的一个错误,instance方法将从版本1.11.0获得,请参阅此问题.

我有一个对话框,对话框中有一个datepicker字段.

当我打开对话框并单击datepicker字段时,datepicker面板显示在对话框后面.

我尝试了更多属性:zindex,stack,bgiframe,但没有成功.

有人可以帮帮我吗？

韩国社交协会.

是否可以在jQuery UI对话框的按钮上添加图标？我试过这样做:

$("#DeleteDialog").dialog({
    resizable: false,
    height:150,
    modal: true,
    buttons: {
        'Delete': function() {
            /* Do stuff */
            $(this).dialog('close');
        },
        Cancel: function() {
            $(this).dialog('close');
        }
    },
    open: function() {
        $('.ui-dialog-buttonpane').find('button:contains("Cancel")').addClass('ui-icon-cancel');
        $('.ui-dialog-buttonpane').find('button:contains("Delete")').addClass('ui-icon-trash');
    }
});

open函数中的选择器似乎工作正常.如果我将以下内容添加到"打开":

$('.ui-dialog-buttonpane').find('button:contains("Delete")').css('color', 'red');

然后我得到一个带红色文字的删除按钮.这还不错,但我真的很喜欢那个小垃圾也可以在删除按钮上进行精灵操作.

编辑:

我对接受的答案做了一些调整:

var btnDelete = $('.ui-dialog-buttonpane').find('button:contains("Delete")');
btnDelete.prepend('<span style="float:left; margin-top: 5px;" class="ui-icon ui-icon-trash"></span>');
btnDelete.width(btnDelete.width() + 25);

添加一些上边距会将图标向下推,因此它看起来像是垂直居中.将25 px添加到按钮的宽度可使按钮文本不会换行到第二行.

我在另一个帖子上找到了这个答案..

如何在Jquery UI对话框中添加多个按钮？

使用此语法,如何将类添加到特定按钮？

 $("#mydialog").dialog({
      buttons: {
        'Confirm': function() {
           //do something
           $(this).dialog('close');
        },
        'Cancel': function() {
           $(this).dialog('close');
        }
      }
    });