ruby on rails - Uncaught ReferenceError in javascript

ruby on rails - Uncaught ReferenceError in javascript

本文关键字:ReferenceError in javascript Uncaught on rails ruby      更新时间:2023-09-26

我正在开发一个Ruby on rails项目。在视图文件中,我有一些javascript来克隆表行按钮点击。每个表格行包含几个输入文本框。现在,我想动态地将id分配给新克隆行的输入文本框。但是我遇到了这个错误:

index:48 Uncaught ReferenceError: item1 is not defined

index为视图名。

我的代码是:
  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"+@counter.to_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>

修改行

new_row_itembox.id=<%= ("item"+@counter.to_s) %>;

new_row_itembox.id='<%= ("item"+@counter.to_s) %>';
                   ^                             ^
                    -------- added these ---------