Question

当我想使用模态更改输入时，更改的数据是最后一个输入...不是我点击的相应按钮。

这是我的代码（）：

dashboard.php

<div id="modalPartID" class="modal fade" role="dialog">
  <div class="modal-dialog" style="width:70%;overflow-y: initial !important;">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title">Browse PartID</h4>
        <br/>
        <input type="text" class="form-control" id="searchPartID" placeholder="PartID"/>
      </div>
      <div class="modal-body" style="height: 300px; overflow-y: auto;">
        <table class="table table-striped">
        <thead>
        <tr>
          <th>PartID</th>
          <th>PartName</th>
          <th>OtherID</th>
        </tr>
        <tbody id="tbodyPartID"></tbody>
        </thead>
        </table>
      </div>
    </div>
  </div>
</div>

dashboard.js

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" placeholder="select" 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);
  $('#plusButtonHasilProduksi').attr('onclick', 'addTableRowDowntime()');
  //buttonPartID onBrowse
  $('#buttonPartID' + row + '').click(function() {
    browsePartID(0, 100, '');
  });
  $('#searchPartID'+ row + '').keyup(function(e) {
    var filter = (e.target.value);
    browsePartID(0, 100, filter)
  });
}

browse.js

$('#buttonPartID').click(function() {
  browsePartID(0, 100, '');
});
$('#searchPartID').keyup(function(e) {
  var filter = (e.target.value);
  browsePartID(0, 100, filter)
});
function browsePartID(start, limit, filter) {
  $.ajax({
    async: false,
    url: 'api/partid.php?start=' + start + '&limit=' + limit + '&filter=' + filter,
    success: function(result) {
      var data = result.result;
      var trData = '';

      for (var i = 0; i < data.length; i++) {
        trData += ' \
          <tr> \
          <td><a onclick="isiFormPartID(\'' + data[i].PartID + '\')">' + data[i].PartID + '</a></td> \
          <td><a onclick="isiFormPartID(\'' + data[i].PartID + '\')">' + data[i].PartName + '</a></td> \
          <td><a onclick="isiFormPartID(\'' + data[i].PartID + '\')">' + data[i].OtherID + '</a></td> \
          </tr> \
          ';
      }

      $('#tbodyPartID').html(trData);
      $('#modalPartID').modal('show');
    }
  });
}

function isiFormPartID(PartID) {
  $('input#typepartid_'+row).val(PartID);
  $('#modalPartID').modal('hide');
}

过去也许你可以给我解决方案，CMIIW。对不起，我的英语不好。

看看这张照片，也许你会理解我的意思。

Answer 1

好的......如果我做对了，问题就在于row变量。

由于我无法测试您的代码，我可以请您尝试以下内容如果它不起作用，请创建一个类似于您的项目的CodePen。只需在模态中使用静态HTML，因为您将无法发出ajax请求。

因此，从文件夹图标中单击：

$('#buttonPartID' + row + '').click(function() {
  browsePartID(0, 100, '');
});

将其更改为：

$("[id^='buttonPartID']").click(function() {  
  row = $(this).closest("tr").index();        // Keep the row number in variable.
  browsePartID(0, 100, '');
});

使用第二次单击处理程序中保存的row变量：

function isiFormPartID(PartID) {
  $('input#typepartid_'+row).val(PartID);     // You were using is correctly here, but the value wasn't correct.
  $('#modalPartID').modal('hide');
}

无法用模态

1 个答案: