2

コンマで区切られた複数の値を持つ JSON 値があります。それを選択ドロップダウン入力としてdomにレンダリングする方法はありますか?

これが私のマークアップのより詳細なビューです。

HTML

 <h1>JSON Grid Edit</h1>

     <table cellpadding="0" cellspacing="0" border="0" class="dt display" id="json-table-edit" contenteditable="true" onKeyUp="editValue(this.id);">
      <thead>
        <tr>
          <th width="25%">Setting</th>
          <th width="75%">Value</th>
        </tr>
      </thead>
      <tbody>
      </tbody>
      <tfoot>
        <tr>
          <th>Setting</th>
          <th>Value</th>
        </tr>
      </tfoot>
    </table>

JSON

     {
      "allconfig": {
         "card.inserted": {
         "value": "Inserted, Not Inserted",
     },
        "card.cisproc": {
        "value": "Processed",
      }
     }
    }

Jクエリ

$.getJSON('json/ione-edit.json', function (data) {
 var newJson = [];
 var myJson = data;
 $.each(myJson.allconfig, function (key, value) {
     var rowArray = [];
     rowArray.push(key);
     $.each(myJson.allconfig[key], function (key1, value1) {
         rowArray.push(value1);
     });
     newJson.push(rowArray);
 });
 $('#json-table-edit').dataTable({
     "bJQueryUI": true,
     "bStateSave": true,
     "sPaginationType": "full_numbers",
     "bProcessing": true,
     "oLanguage": {
         "sLengthMenu": ' <select>' + '<option value="10" selected="selected">Filter</option>' + '<option value="10">10</option>' + '<option value="20">20</option>' + '<option value="30">30</option>' + '<option value="40">40</option>' + '<option value="50">50</option>' + '<option value="-1">All</option>' + '</select>'
     },
     "aaData": newJson
 });
4

2 に答える 2

1

1 つの方法は、プレーンな Javascript メソッドを使用すること.split()です。

splitカンマ区切りの文字列を配列に変換する値文字列が必要です。次に、配列を実行してドロップダウンを作成する必要がありますselect。

JSON 戻り関数内のこのようなもの (正確にこれらの変数名ではなく、アイデアを示すための単なる例です):

$('#SelectContainer').html('<select name="mySelect">');
var options = value.split(',');
for (counter=0; counter < options.length; counter++)
{
    $('#SelectContainer').append('<option value="' + options[counter] + '">' + options[counter] + '</option>');
}
$('#SelectContainer').append('</select>');
于 2013-04-02T02:52:15.967 に答える