動的リストからJSONオブジェクトを作成

Question

私は動的リストを持ち、各行から各オブジェクトを取得し、配列を含むJSONオブジェクトに変換します。 これを行うにはどうすればよいのでしょうか？どんな例も素晴らしいでしょう。

<div id="clientList"> 
    <row id="row_ccf06bc6-75e5-6db5-e7ed-b3f08856fb61"> 
     <label class="col-lg-1 control-label">Name:</label> 
     <div class="col-lg-2"><input type="text" id="ClientName_ccf06bc6-75e5-6db5-e7ed-b3f08856fb61"> 
      <input type="hidden" id="ClientId_ccf06bc6-75e5-6db5-e7ed-b3f08856fb61"> 
    </row> 
    <row id="row_cb5dbc04-62cd-5a19-edf2-2526f7b2aa91"> 
     <label class="col-lg-1 control-label">Name:</label> 
     <div class="col-lg-2"><input type="text" id="ClientName_cb5dbc04-62cd-5a19-edf2-2526f7b2aa91"> 
      <input type="hidden" id="ClientId_cb5dbc04-62cd-5a19-edf2-2526f7b2aa91"> 
    </row> 
</div> 

var Account = new object(); 
$.each(row_??? 
    Account.Clients ='[ClientId: ClientId_???, ClientName: ClientName_???]' 
) 

Answer 1

その代わり配列を含むプロパティを持つオブジェクトを、オブジェクトの配列として出力を有するように、より理にかなっています。このことを念頭に置いて、あなたはそれを達成するためにmap()を使用することができます：私はinput要素から値を取得するために:eq()セレクタを使用

var arr = $('#clientList row').map(function() { 
 
    var $row = $(this); 
 
    return { 
 
    ClientName: $row.find('input:eq(0)').val(), 
 
    ClientId: $row.find('input:eq(1)').val() 
 
    }; 
 
}).get(); 
 

 
console.log(arr);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="clientList"> 
 
    <row id="row_ccf06bc6-75e5-6db5-e7ed-b3f08856fb61"> 
 
    <label class="col-lg-1 control-label">Name:</label> 
 
    <div class="col-lg-2"> 
 
     <input type="text" id="ClientName_ccf06bc6-75e5-6db5-e7ed-b3f08856fb61" value="Client 1 name" /> 
 
     <input type="hidden" id="ClientId_ccf06bc6-75e5-6db5-e7ed-b3f08856fb61"value="Client 1 id" /> 
 
    </div> 
 
    </row> 
 
    <row id="row_cb5dbc04-62cd-5a19-edf2-2526f7b2aa91"> 
 
    <label class="col-lg-1 control-label">Name:</label> 
 
    <div class="col-lg-2"> 
 
     <input type="text" id="ClientName_cb5dbc04-62cd-5a19-edf2-2526f7b2aa91" value="Client 2 name" /> 
 
     <input type="hidden" id="ClientId_cb5dbc04-62cd-5a19-edf2-2526f7b2aa91" value="Client 2 id"/> 
 
    </div> 
 
    </row> 
 
</div>

注意。選択を簡単にし、コードを脆弱にしないために、これらの要素にクラスを配置する方がよいでしょう。

また、</div>タグが2つ欠けているので、HTMLを修正する必要があります。