[解決済み] jQuery UI ダイアログへのデータの渡し方

質問

私は 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>

それでは最後に私の質問です。どうすればこれを達成できるでしょうか、それとももっと良い方法があるでしょうか？

どのように解決するのですか？

このようにすればよいでしょう。

• をマークします。 <a> をクラスでマークし、例えば "cancel"とします。

• class="cancel"を持つすべての要素に作用して、ダイアログを設定します。

  $('a.cancel').click(function() { 
    var a = this; 
    $('#myDialog').dialog({
      buttons: {
        "Yes": function() {
           window.location = a.href; 
        }
      }
    }); 
    return false;
  });
  
  

(さらに他のオプションも)

ここで重要なのは

• できるだけ目立たないようにする。
• URLだけであれば、hrefで既に持っている。

しかし、キャンセルアクションには副作用があるため、これをGETではなくPOSTにすることをお勧めします。 はGETセマンティクスに準拠しないためです。 ...