1

このアプリケーションでは、一般的な関数を使用して、モジュール固有のコンテンツを含むjQueryダイアログを作成します。カスタムダイアログは、3つのボタン([キャンセル]、[保存]、[適用])で構成されています。適用は保存と同じことを行いますが、ダイアログも閉じます。

多くのモジュールはまだajax-postの代わりにカスタムpostを使用しています。このため、特定のダイアログにあるボタンを上書き/再定義しようとしています。

これまでのところボタンはありますが、何もできません。ダイアログからボタンを取得することは可能ですか(はい、私は知っています)が、それらに別の機能を適用しますか?

これまでの私のコード:

function OverrideDialogButtonCallbacks(sDialogInstance) {
  oButtons = $( '#dialog' ).dialog( 'option', 'buttons' );
  console.log(oButtons); // logs the buttons correctly

  if(sDialogInstance == 'TestInstance') {
    oButtons.Save = function() {
      alert('A new callback has been assigned.');
      // code for ajax-post will come here.
    }
  }
}
4

4 に答える 4

2
$('#dialog').dialog({
'buttons' : {
    'Save' : {
        id:"btn-save", // provide the id, if you want to apply a callback based on id selector
        click: function() {
           //
        },
    },
}
});

これを試しましたか?必要に応じてボタンのコールバックを上書きします。

于 2012-10-09T10:06:48.800 に答える
2

再割り当てする必要はまったくありません。これを試して。

function OverrideDialogButtonCallbacks(dialogSelector) {
    var button = $(dialogSelector + " ~ .ui-dialog-buttonpane")
                    .find("button:contains('Save')");

    button.unbind("click").on("click", function() {
        alert("save overriden!");
    });
}

のように呼びますOverrideDialogButtonCallbacks("#dialog");

作業フィドル: http://jsfiddle.net/codovations/yzfVT/

于 2012-10-09T11:42:06.000 に答える
1

を使用してボタンを取得できます$(..).dialog('option', 'buttons')。これによりオブジェクトの配列が返され、それらを検索してクリック イベントを調整することで再接続できます。

// Rewire the callback for the first button
var buttons = $('#dialog').dialog('option', 'buttons');
buttons[0].click = function() { alert('Click rewired!'); };

例については、このフィドルを参照してください: http://jsfiddle.net/z4TTH/2/

必要に応じて、 を使用してボタンのテキストを確認できますbutton[i].text


アップデート:

buttonsオプションは 2 つの形式のいずれかです。1 つは上記の配列で、もう 1 つは各プロパティがボタンの名前であるオブジェクトです。このインスタンスでクリック イベントを再配線するbuttonsには、ダイアログのオプションを更新する必要があります。

// Rewire the callback for the OK button
var buttons = $('#dialog').dialog('option', 'buttons');
buttons.Ok = function() { alert('Click rewired!'); };

$('#dialog').dialog('option', 'buttons', buttons);

このフィドルを参照してください: http://jsfiddle.net/z4TTH/3/

于 2012-10-09T10:30:08.760 に答える
0

新しい関数コードを Save の Click イベントにバインドしてみてください。

if(sDialogInstance == 'TestInstance') {
            $('#'+savebtn_id).click(function() {
              alert('A new callback has been assigned.');
              // code for ajax-post will come here.
            });
    }   
于 2012-10-09T10:15:49.880 に答える