jqueryとdatatableはまったく新しい。すべての編集可能なフィールドを表示するカラーボックスdivを呼び出す編集ボタンを追加したいと思います。誰かがこれをどのように達成できるかについて正しい方向に私を向けることができますか?
各フィールドにsClassを追加し、fnDrawCallbackコールバックを使用してフィールドからカラーボックスを呼び出すことができました。しかし、これはちょっと面倒で、編集のために各行の最後にボタンがあります。ポインタをありがとうございます。
jqueryとdatatableはまったく新しい。すべての編集可能なフィールドを表示するカラーボックスdivを呼び出す編集ボタンを追加したいと思います。誰かがこれをどのように達成できるかについて正しい方向に私を向けることができますか?
各フィールドにsClassを追加し、fnDrawCallbackコールバックを使用してフィールドからカラーボックスを呼び出すことができました。しかし、これはちょっと面倒で、編集のために各行の最後にボタンがあります。ポインタをありがとうございます。
aoColumnDefs の列定義に fnCreatedCell コールバックによって追加できます。次の例では、最初の列の値にリダイレクトする onclick イベント ハンドラーを使用して、最初の行にボタンを追加します (これは変更したいものです。
"aoColumnDefs" : [
{
"aTargets": [0],
"fnCreatedCell" : function(nTd, sData, oData, iRow, iCol){
var b = $('<button style="margin: 0">edit</button>');
b.button();
b.on('click',function(){
document.location.href = oData[0];
return false;
});
$(nTd).empty();
$(nTd).prepend(b);
}
},
優れたDataTables Editableプラグインの使用をお勧めします。プラグインを使用すると、テーブル内のフィールドを直接編集するのが非常に簡単になります。
本当に各行にボタンが必要な場合は、サーバー側でテーブルを生成するときにボタンを追加するか、jQuery を使用して追加できます。次に、アクションをボタンにバインドする必要があります。
ボタンを挿入したいとしましょう。コードは次のようになります。
$('#form-id').delegate('.edit-button', 'click', function() {
// action
}).find('.classname-of-field-for-button').html('<button class="edit-button">');