Передача данных в диалоговое окно jQuery UI - PullRequest
Новая
       31

Передача данных в диалоговое окно jQuery UI

83 голосов
/ 27 декабря 2008

Я разрабатываю сайт 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 в следующем сценарии: 

$(function() {
    $("#dialog").dialog({
        autoOpen: false,
        buttons: {
            "Yes": function() {
                alert("a Post to :/Booking.aspx/Cancel/10 would be so nice here instead of the alert");},
            "No": function() {$(this).dialog("close");}
        },
        modal: true,
        overlay: {
            opacity: 0.5,
            background: "black"
        }
    });
});

и сам диалог: 

   <div id="dialog" title="Cancel booking">Are you sure you want to cancel your booking?</div>

Итак, наконец, на мой вопрос: как мне это сделать? или есть лучший способ сделать это?

Ответы [ 11 ]

0 голосов
/ 28 декабря 2008

Хорошо, первая проблема с тегом div была достаточно простой: Я просто добавил style="display:none;" к нему, а затем перед отображением диалогового окна добавил это в свой скрипт: 

$("#dialog").css("display", "inherit");

Но для почтовой версии мне все еще не повезло.

Страница:
...