各ラジオボタンのオブジェクトの別個の配列を読み取る方法

Question

この問題は、データベースから各ラジオボタンのユニークな要素を読み取る際に発生します。 これは、データ構造であると私はデータベース

{ FormularID: 182, 
    CampaignID: 14, 
    FormLabel: 'Confirm', 
    InputType: 'radio', 
    InputDetails: 'Remind;NoReminder', 
    InputPosition: 6 }, 
{ FormularID: 190, 
    CampaignID: 14, 
    FormLabel: 'Gender', 
    InputType: 'radio', 
    InputDetails: 'Male;Female', 
    InputPosition: 6 } ] } 

から取得することがあり、入力タイプで、入力フィールドと入力詳細フィールドコンテナセミコロン区切りの値を詳述します。 私がしたいことは、各ラジオの入力タイプを読み取り、関連する入力の詳細を分割し、htmlビューでレンダリングすることです。 したがって、例えば ラジオの性別には男性と女性のオプションがあります ラジオの確認にはリマインドとNoRemindオプションそれに。 私はこのコードを試しましたが、データを1つの入力ファイルにまとめて取得します。私のコード構造とロジックには何が欠けていますか？どんな助けもありがとう。 これまで私が持っていたこと。

for(var i in mydata.formular){ 
     switch(mydata.formular[i].InputType){ 
     case 'radio': 
      var detailObj={}; 
      inputdetails=mydata.formular[i].InputDetails.split(';') 
      for(var k=0;k<inputdetails.length;k++){ 
      detailObj[k]=inputdetails[k] 

      } 
     radiodetails.push(detailObj) 

      console.log(radiodetails) 
     break; 

     default: 
     detailObj={} 
     } 
    } 

と私の見解では、私はこの

<%for(var i=0; i< templateData.formular.length; i++){ %> 
      <div class="form-group"> 
       <label for="userinput"><%=templateData.formular[i].FormLabel %></label> 
       <% if (templateData.formular[i].InputType=="radio") { %> 
       <div class="option-margin-top"> 
        <% for(var k=0; k<InputDetails.length; k++){ %> 
         <label class="radio-inline"><input class="userinput" type="<%=templateData.formular[i].InputType %>" value="<%=InputDetails[k]%>" name="optionsRadios" ><%=InputDetails[k]%></label> 
        <% } %> 
       </div> <% } %> 

Answer 1

最初にやる私は少しにテンプレートを簡素化：

var splitInputs = _.map(inputs, function(input){ 
    var result = _.merge({}, input); // just to clone 
    result.InputDetails = result.InputDetails.split(';'); 
    return (result); 
}); 

var templateString = "<% _.each(inputs, function(input) { %>" + 
    "<div class='form-group'><label><%= input.FormLabel %></label>" + 
     "<% _.each(input.InputDetails, function(option) { %>" + 
     "<label><input type='radio' name='<%= input.FormLabel %>' value='<%= option %>'><%= option %></label>" + 
     "<% }); %>" + 
    "</div><% }); %>"; 

それはあなたのために働く場合は、あなたのクラスや構造を追加することができます。

機能的プログラミング、特にlodashを使用するときは、インデックスベースの各for/overループ（for（i = ....））を使用することをお勧めします。私たちのテンプレートの違いを参照してください。

ここで、「オールインワンインプット」問題を理解すると、名前グループと関係があります。タイプラジオの入力は、名前フィールドでグループ化されます。静的な名前（optionsRadios）を使用しているので、それらはすべて一緒にグループ化されます。それらを分けるために、私は各項目に独自の名前を付けました（私はFormLabelを使用しましたが、他の特有のフィールドを使いたいかもしれません）。これは問題を解決します。

working jsbin that generates the text hereがあります。

Answer 2

何とか修正しました。ビューにデータを送信し、各ラジオ・オプションで分割を行い、データを入力に割り当てます。

<%for(var i=0; i< templateData.formular.length; i++){ %> 
      <div class="form-group"> 
       <label for="userinput"><%=templateData.formular[i].FormLabel %></label> 
       <% if (templateData.formular[i].InputType=="radio") { %> 
This where I get the input and spit in EJS and loop through to assign the values 
       <% var RadioValues = templateData.formular[i].InputDetails.split(';') %> 
       <div class="option-margin-top"> 
        <% for(var k=0; k<RadioValues.length; k++){ %> 
         <label class="radio-inline"><input class="userinput" type="<%=templateData.formular[i].InputType %>" value="<%=RadioValues[k]%>" name="<%=templateData.formular[i].FormLabel %>" ><%=RadioValues[k]%></label> 
        <% } %> 
       </div><% } %>