2016-08-11 11 views
0

私はRuby on railプロジェクトを開発中です。ビューファイルには、ボタンクリック時にテーブル行をクローンするためのjavascriptがあります。各テーブル行には複数の入力テキストボックスが含まれています。今度は、新しく複製された行の入力テキストボックスにIDを動的に割り当てる必要があります。しかし、私はこのエラーを直面しています:javascriptのUncaught ReferenceError

指数:48キャッチされないにReferenceError:ITEM1が定義されていない

インデックスは、ビュー名です。

私のコードは次のとおり

function insRow() 
    { 
     var x=document.getElementById('POITable'); 
     var new_row = x.rows[1].cloneNode(true); 
     new_row.style.visibility = "visible"; 
     var len = x.rows.length; 

     new_row_itembox=new_row.cells[0].getElementsByTagName("input"); 
     new_row_itembox.id=<%= ("item"[email protected]_s) %>; //this line causes the error 
     //console.log(new_row_itembox); 

     var inp1 = new_row.cells[1].getElementsByTagName('input')[0]; 
     inp1.id += len; 
     inp1.value = ''; 
     var inp2 = new_row.cells[2].getElementsByTagName('input')[0]; 
     inp2.id += len; 
     inp2.value = ''; 
     x.appendChild(new_row); 

     var sec_last_row=x.rows[x.rows.length-2]; 
     console.log(x.rows.length); 
     console.log(x.rows[x.rows.length-2]); 
     sec_last_row.cells[5].innerHTML="<img alt='Icon' src='/assets/minus-icon.png' id='delPOIbutton' onclick='deleteRow(this)'/>"; 
     sec_last_row.cells[6].innerHTML=""; 

     var last_row=x.rows[x.rows.length-1] 

     last_row.cells[5].innerHTML="<img alt='Icon' src='/assets/add-icon.png' id='addmorePOIbutton' onclick='insRow(this)'/>"; 
     last_row.cells[6].innerHTML="<img alt='Icon' src='/assets/minus-icon.png' id='delPOIbutton' onclick='deleteRow(this)'/>"; 
    } 

ザJavaScript関数の上方にボタンのクリックに別の行を挿入するためのものです。

@counterは、対応するコントローラアクションで定義されたrails変数です。

私はその部分を削除し、入力ボックスのIDを静的に割り当てるとうまくいきます。

私のhtmlコードは次のとおりです。

<body> 
<form> 
<center> 
<div id="POItablediv"> 
<br/> 
<table id="POITable"> 
    <tr> 
     <th>Item</th> 
     <th>Brand</th> 
     <th>UOM</th> 
     <th>Quantity</th> 
     <th>Remarks</th> 
    </tr> 

    <tr style="visibility:hidden;">    <!-- This is just a dummy row--> 
     <td><input size=25 type="text"/></td> 
     <td><input size=25 type="text"/></td> 
     <td><input size=25 type="text"/></td> 
     <td><input size=25 type="text"/></td> 
     <td><input size=25 type="text"/></td> 
     <td><img alt="Icon" src="/assets/add-icon.png" id="addmorePOIbutton" onclick="insRow()" /></td> 
     <td><img alt="Icon" src="/assets/minus-icon.png" id="delPOIbutton" onclick="deleteRow(this)"/></td> 
    </tr> 

    <tr> 
     <td><input size=25 type="text"/></td> 
     <td><input size=25 type="text"/></td> 
     <td><input size=25 type="text"/></td> 
     <td><input size=25 type="text"/></td> 
     <td><input size=25 type="text"/></td> 
     <td><img alt="Icon" src="/assets/add-icon.png" id="addmorePOIbutton" onclick="insRow()" /></td> 
     <td><img alt="Icon" src="/assets/minus-icon.png" id="delPOIbutton" onclick="deleteRow(this)"/></td> 
    </tr> 
    </table> 
    </div> 

    <input type="submit" name="submit_button" onclick="make_hash()"> 


    </center> 
    </form> 
    </body> 
+0

​​

行は48行であるかわからない、と何の 'item1'は、あなたの中にありませんコード - おそらく間違ったコードを投稿しました –

+0

次の行を見てください:new_row_itembox.id = <%=( "item" + @ counter.to_s)%>; – Abhradip

+0

私はそれが参照された場所を知っています。それは存在するという証拠がありません。 –

答えて

2

変更

new_row_itembox.id='<%= ("item"[email protected]_s) %>'; 
       ^       ^
        -------- added these --------- 
+0

私が直面している別の問題。 <%@カウンタ= @カウンタ+ 1%>は機能しません。私が<%@ counter = @ counter + 1%> – Abhradip

+0

を使用しているので、まだ印刷項目1 ...(item2、item3、item4 .....を出力するはずです)はサーバー側のコードの問題です。表示されていない、と私は、彼女がレール上にあるかどうかに関係なく、私はルビーについては何も知っていることを告白する –

+0

そのokkの兄弟:) – Abhradip

関連する問題