2017-05-18 13 views
0

動的に作成された入力のID値を、動的に作成されたテーブル内で次のコードで設定しようとしています。論理的には、idをtable.description + i(例:V1、F1)に設定しようとしていますが、テーブルを正しく作成することはできず、コンソールは各繰り返しに対してnewInput.idを表示します。どのように記述と反復子の値に一致するid値を割り当てることができますか?動的に作成された入力でinput.idを設定する方法

おかげ

function addBaseTable() { 

var BaseTable = [ 
{"description": "V", input1: true, "specification": "Pass/Fail", input2: false, input3: false, input4: true,"result": "Pass",input5: true}, 
{"description": "F",input1: true,"specification": "≥ " + fSpec + "mL/min<br>" +flowAmtMin ,input2: true,input3: true,input4: true,"result": "Pass",input5: true}, 
{"description": "BP",input1: true,"specification": "≥ " + bpSpec + " psi <br>RV:Spec "+bpRV+" ",input2: true,input3: true,input4: true,"result": "Pass",input5: true}, 
{"description": "RP",input1: true,"specification": "≤ " + rpSpec + "",input2: true,input3: true,input4: true, "result":"Pass",input5: true}, 
{"description": "V2",input1: true,"specification": "≥ " + v2Spec + " ",input2: false,input3: false,input4: true,"result": "Pass",input5: true}, 
{"description": "HB",input1: true,"specification": '≥ +' + bSpec + ' psi <br>RV:',input2: false,input3: false,input4: true,"result": "Pass",input5: true}, 
{"description": "SD",input1: true,"specification": '≤ ' + sdSpec + ' <br>RV: 0 Range ',input2: true,input3: true,input4: true,"result": "Pass",input5: true}, 
{"description": "P",input1: true,"specification": "< 0",input2: false,input3: false,input4: true,"result": "Pass",input5: true} 
]; 

var allRows = []; 
for (var i = 0; i < IV5BaseTable.length; i++) { 

var row = "<tr>" + "<td>" + BaseTable[i].description + "</td>" + 
    "<td>" + createInput(BaseTable[i].input1,BaseTable,i) + "</td>" + 
    "<td>" + BaseTable[i].specification + "</td>" + 
    "<td>" + createInput(BaseTable[i].input2,BaseTable,i) + "</td>" + 
    "<td>" + createInput(BaseTable[i].input,BaseTable,i3) + "</td>" + 
    "<td>" + createInput(BaseTable[i].input4,BaseTable,i) + "</td>" + 
    "<td>" + BaseTable[i].result + "</td>" + 
    "<td>" + createInput(BaseTable[i].input5,BaseTable,i) + "</td>" + "</tr>"; 

    allRows.push(row); 
} 

var tableRef = document.getElementById("tBodyTestTable"); 

tableRef.innerHTML = allRows.join(" "); 
} 
//Pass True||False, the Table, and the row number 
function createInput(val,table, i){ 
var opt = { 
true: function(){ 
    var newInput = '<input type="text" class="testingField"/>'; 
    newInput.id = "table.description" + i ; 
    return newInput; 
}, 
false: function(){ 
    return "N/A" 
} 
    }; 
    return opt[val](); 
} 
+0

文字列の 'id'プロパティを設定しています。実際の ''要素が必要な場合は、 'document.createElement( 'input')'を使用してください。 –

答えて

0

あなたは、このようにコードを変更する必要があります。また、newInputは文字列なので、プロパティIDを付けることはできません。代わりに、私がtable[i].descriptionを使用してIDプロパティを書いているところの上のコードで表示している方法で使用してください。

0

あなたがこれを使用することができます。あなたが引用符で囲まれた文字列で"table.description"を使用している

true: function(){ 
    var newInput = '<input type="text" class="testingField" 
    id="'+table[i].description + i+'"/>'; 

    //newInput.id = "table.description" + i ;//Comment this line 
    return newInput; 
} 

注:

true: function(){ 
    var newInput = document.createElement("input"); 
    newInput.setAttribute("id", table.description + i); 
    newInput.setAttribute("type", "text"); 
    newInput.setAttribute("class", "testingField"); 
    return newInput; 
} 

それとも、これを使用することができ、

true: function(){ 
    var id = table.description + i; 
    return '<input type="text" class="testingField" id="'+id+'">'; 
} 
関連する問題