當按下按鈕時自動添加行

Question

我在兩個選項卡（選項卡hasilproduksi和選項卡停機時間）中有兩個表。每個選項卡都是帶有表格的頁面。當我點擊加號按鈕時，我想向表中添加一行。我的代碼無法按預期工作，我非常感謝任何幫助。

tab_hasilproduksi

tab_donwtime

這裏是我的代碼（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：

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> \ 
 
\t <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); 
 
}

Answer 1

保持全局計數器像var cnt = 0;，這將保持次數添加按鈕被點擊。

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()內循環。

希望這會幫助你。

Answer 2

你能在+點擊按鈕添加一個事件監聽器？如果是的話它應該是簡單的，只需要調用事件偵聽器的addTableRowDowntime()功能，是這樣的：

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