カスタム jQuery UI ウィジェットを追加するためにカスタム ノックアウト bindingHandler を作成しようとしていますが、バインディング中に作成された要素にアクセスしようとして問題が発生しました。これには、私が見逃している基本的な何かがあると確信しています。私は次のhtmlを持っています:
<table data-bind="myGrid: {}">
<thead>
<tr data-bind="foreach: { data: columns, as: 'column' }">
<th data-bind="text: column"></th>
</tr>
</thead>
<tbody data-bind="foreach: { data: rows, as: 'row' }">
<tr data-bind="foreach: { data: $parent.columns, as: 'column' }">
<td data-bind="text: row[column]"></td>
</tr>
</tbody>
</table>
そして、次のJavaScript:
var vm = {
columns: [
'A', 'B'
],
rows: []
};
$.widget("my.grid", {
_create: function() {
var columns = this.element.find('th');
}
});
ko.bindingHandlers.myGrid = {
init: function (element) {
//$(element).grid();
},
update: function(element) {
$(element).grid();
}
};
ko.applyBindings(vm);
ウィジェットが作成されるとき、バインディングから作成された各要素を見つける必要があります。ただし、要素はその時点では作成されていないようです。bindinghandler の init メソッドと update メソッドの両方を試しました。
これは、要素にウィジェットを手動で追加した場合に機能しますが、バインディング ハンドラー内ではありません。
jQuery ウィジェットで要素を変更できるように、データ バインディングから作成された要素にアクセスするには、いつ、どのようにすればよいですか?