2

長い検索の後、ここで試してみることにしました。テーブルに jQuery UI ダイアログ ボックスを実装したいと考えています。ボックスに、長い説明を持つ追加のセルを表示したいのですが、通常はテーブルのレイアウトが台無しになります。ボタンをクリックすると、追加情報が表示されます。

私は標準的なコードを持っています:

$.fx.speeds._default = 1000;
$(function() {
    $( ".dialog" ).dialog({
        autoOpen: false,
        show: "blind",
        hide: "explode"
    });

    $( ".opener" ).click(function() {
        $( ".dialog" ).dialog( "open" );
        return false;
    });
});

およびphp：

   echo "<td align=center>".$okres[$i]."</td>";
   echo "<td ><button class='opener'>Desription</button><div class='dialog' title='$training[$i]'>".$opis[$i]."</div></td>";
   echo "<td align=center>".$status[$i]."</td>";

機能しますが、すべての行のボックスが開きます。関連するボックスのみを開く方法がよくわかりません。

助けてください。

4

2 に答える 2

0

あなたはこれを試すことができます

$(function() {
    $( ".opener" ).click(function(e) {
        e.preventDefault();
        var index=$(this).closest('tr').index();
        $($(".dialog")[index]).dialog("open");
    });
});​

デモ。

于 2012-08-29T10:23:10.030 に答える
0

各行に動的IDを使用し、onclickで問題の行のIDを送信してから、その行のみの説明を表示します

于 2012-08-29T09:54:28.303 に答える