2

ノックアウトと JQuery UI を使用してフォーム ビルダーを実装したいと考えています。

Knockout のソート可能なプラグインとその他の素材を見つけ、フォーム ビルダーのフレームワークを実装しました。

基本的に、使用可能なすべてのフィールド タイプとそのプロパティを保持する監視可能な配列と、フォームに追加されたコントロールを保持する別の配列があります。クリックするだけでフィールドを追加するバインディングを追加したので、高速ユーザーはドラッグ アンド ドロップの手間を省くことができます。また、フィールドの詳細に移動する、追加されたフィールドのクリック イベント (現在はアラートのみが表示されます)。

フォームに追加されるすべてのフォーム要素に ID を割り当てたいと考えています。別の要素がフォームに追加された場合は、ID がインクリメントされ、フォーム内の要素が再配置された場合は、要素の ID も変更される必要があります。

私の質問は、この ID の割り当てと再割り当てをどこでどのように実行する必要があるかということです。そのため、フォーム要素の ID の周りに新しいフィールドが追加または移動されるたびに、連続した順序になります。

バインド ハンドラーでドロップされたすべての要素に ID を割り当てることができると思いますが、後でそれを制御するにはどうすればよいですか?:

$(element)[0].id = 'field-nr-' + globalVariable++;

これは、Knockout Sortable プラグインを変更する必要があることも意味します。回避しようとしている魔女です。

コードはこのフィドルにあります: http://jsfiddle.net/razvangl/z52G7/

4

1 に答える 1

1

私がこれを正しく理解していれば、$indexおそらくforeach.

したがって、次のようにバインドします。

<table style="width : 100%" data-bind="attr: { id: 'field-nr-' + $index() }" >

フィールドをドラッグすると、id は observableArray 内の位置に基づいて更新されたままになります。

私はあなたのフィドルを更新しました(そしてKOバージョンを更新しました)tdhttp://jsfiddle.net/rniemeyer/56PLd/

于 2013-09-18T13:48:10.870 に答える