Question

我在两个标签中有两个表格（标签hasilproduksi和标签停机时间）。每个选项卡都是一个带有表格的页面。当我点击加号按钮时，我想在表格中添加一行。我的代码没有按预期工作。

这是我的代码（tab_hasilproduksi）：

function addTableRowHasilProduksi() {
    row = parseInt($('#tableRowHasilProduksi').val()) + 1;
    $('#plusButtonHasilProduksi').remove();
    var html = ' \
    <tr id="rowTableHasilProduksi_' + row + '"> \
      <td> \
        <div class="input-group"> \
            <input id="typepartid_' + row + '" class="form-control ui-autocomplete" type="text" onchange="myFunction(' + row + ')" name="typepartid_' + row + '"  >\
            <span class="input-group-btn">\
            <button type="button" class="btn btn-default glyphicon glyphicon-folder-open" name="button" id="buttonPartID' + row + '">\
            </button>\
            </span>\
                    </div>\
      </td> \
     <td>\
        <select id="hasilproduksi_' + row + '" class="form-control" onchange="hasilProduksiChage(' + row + ')" name="hasilproduksi_' + row + '"> \
          <option value="-">--Select--</option>\
          <option value="Good">Good</option>\
          <option value="Repair">Repair</option>\
          <option value="Reject">Reject</option>\
        </select> \
      </td> \
      <td><input id="qty_' + row + '" type="text" class="form-control"  onkeydown="return numbersonly(this, event);" onkeyup="javascript:tandaPemisahTitik(this);" name="qty_' + row + '" /> \
      </td> \
      <td id="tdTypeReject_' + row + '"> \
        <select id="typereject_' + row + '" class="form-control" name="typereject_' + row + '"> \
        ' + htmlTypeReject + ' \
        </select> \
      </td> \
      <td><input id="keteranganreject_' + row + '" type="text" class="form-control" name="keteranganreject_' + row + '"/></td> \
      <td><button type="button" class="btn btn-sm btn-default" onclick="deleteRowHasilProduksi(' + row + ')">x</button></td> \
    </tr> \
    <tr id="plusButtonHasilProduksi"> \
      <td colspan="6"><button type="button" class="btn btn-sm btn-default" style="width:100%" onclick="addTableRowHasilProduksi()">+</button></td> \
    </tr>';
    $('#tableHasilProduksi > tbody').append(html);
    //variable row table add +1
    $('#tableRowHasilProduksi').val(row);

}

tab_downtime：

＆＃13;

function addTableRowDowntime() {
  row = parseInt($('#tableRowDowntime').val()) + 1;
  $('#plusButtonDowntime').remove();
  var html = ' \
    <tr id="rowTableDowntime_' + row + '"> \
      <td><button type="button" class="btn btn-sm btn-default" onclick="deleteRowDowntime(' + row + ')">-</button></td> \
	   <td><input id="partdown_' + row + '" type="text" class="form-control" name="partdown_' + row + '" readonly="readonly"></input>\</td> \
      <td id="tdDowntime_' + row + '"> \
        <select id="downtime_' + row + '" class="form-control" name="downtime_' + row + '"> \
        ' + htmlDowntime + ' \
        </select> \
      </td> \
      <td><input id="durasi_' + row + '" class="form-control" type="text" name="durasi_' + row + '" onfocusout="durasiOnFocusOut(this)" onfocusin="durasiOnFocusIn(this)"/></td> \
      <td><input id="keterangandowntime_' + row + '" class="form-control" type="text" name="keterangandowntime_' + row + '"/></td> \
    </tr> \
    <tr id="plusButtonDowntime"> \
      <td colspan="5"><button type="button" class="btn btn-sm btn-default" style="width:100%" onclick="addTableRowDowntime()">+</button></td> \
    </tr>';
  $('#tableDowntime > tbody').append(html);
  //variable row table add +1
  $('#tableRowDowntime').val(row);
}

＆＃13;

Answer 1

您可以点击+按钮添加事件监听器吗？如果是这样，它应该很简单，只需在事件监听器中调用addTableRowDowntime()函数，例如：

$('#plusButtonHasilProduksi').on('click', function() { addTableRowDowntime(); });

Answer 2

保留var cnt = 0;之类的全局计数器，这将保留tab_hasilproduksi中点击添加按钮的次数。

var cnt = 0;
function addTableRowHasilProduksi() {
  ...
  ...
  //variable row table add +1
  $('#tableRowHasilProduksi').val(row);
  cnt++;
}

将标签切换为tab_downtime后（您需要在有条件的基础上查看）

for(var i=0; i<cnt; i++){
  addTableRowDowntime();
}

在循环内调用addTableRowDowntime()。

希望这会对你有所帮助。

单击按钮时自动添加行

2 个答案: