サードパーティの JavaScript プラグインを使用して、要件に従って 2 列のテーブル機能を開発しています。json
プラグインは、次のような入力配列を受け入れます。
var data = {"Project" : [{'Start':'02/20/2012',
'End':'02/20/2012',
'Content':'Project Description',
'Group' : 'Table Group 1'
},...
] };
Group
上記のプラグインで使用すると、内部的に次のようにレンダリングさjson
れる任意のタイプのコンテンツ ( ) を指定できます。custom html content as well
var items = []; //json array items will be pushed by items.push from input `data` json
for(var i=0,im = items.length;i<im;i++){
var group = items[i].Group;
groupDiv.innerHtml = group;
}
私の場合、Group
アイテムのjson array
アイテムに、次のようなカスタム HTML を渡しています。
var customHtml = '<div><span class="button-red"></span>'+
'<div class = "quick-info-hide">' +
'Some Custom Content from input' +
'</div></div>'
私はcustomHtml
いくつかの入力 (別のより大きな json) からこれを生成し、それをプラグインに送信していますが、プラグイン自体を変更しないようにしていました。ただし、プラグインを変更して、ここに特定の機能 (行の拡張on/off
) を追加する必要がありました。
行が展開されていない場合、customHtml のspan
anddiv
は classstyle1
である必要があり、展開されている場合、customHtml のspan
anddiv
は class である必要がありstyle2
ます。
ただし、プラグイン内では、展開/折りたたみcustomHtml
なしで割り当てられます。if condition
プラグインは のロジックで構築さrow expansion/collapse on click
れていないため、同様に構築されることは想定されていませんでした。groupDiv.innerHtml
ここで展開/折りたたみ時にスタイルを変更して、つまり customHtmlに割り当てたいと思いcustomHtml1
ます。これは、異なるスタイルを持つ別のバリエーションによって実行できる可能性があります。
これを行うための最良のアプローチは何ですか?
hereを追加して、プラグインで のif condition
2 つのバリエーションを送信し、それぞれに適切なものを適用する必要がありますか? この場合、プラグインの一般的なアプローチを台無しにしないためのより良い方法はありますか (私はここで変更を加えているようです)?customHtml
condition