我想结合2种不同的Java脚本

Question

我有2个Java脚本代码，一个作为搜索建议，第二个用于动态添加另一个表单字段，第二个脚本也计算输入字段中给定的值，但是两个脚本都具有“添加更多产品”功能。我想要的是我想同时使用'ADD more'功能，因为第一个脚本对id =“”标签起作用，以标识显示搜索结果的字段，但是第二个脚本却不这样做。

成功获取第一行中的详细信息，但是当我单击“添加由第二个脚本填充的更多按钮”时，它不起作用

//Script to fetch details based on search box :

$(document).ready(function() {

  $(document).on('keydown', '.prname', function() {

    var id = this.id;
    var splitid1 = id.split('_');
    var index1 = splitid1[1];

    $('#' + id).autocomplete({
      source: function(request, response) {
        $.ajax({
          url: "getDetails.php",
          type: 'post',
          dataType: "json",
          data: {
            search: request.term,
            request: 3
          },
          success: function(data) {
            response(data);
          }
        });
      },
      select: function(event, ui) {
        $(this).val(ui.item.label); // display the selected text
        var prid = ui.item.value; // selected id to input

        // AJAX
        $.ajax({
          url: 'getDetails.php',
          type: 'post',
          data: {
            prid: prid,
            request: 4
          },
          dataType: 'json',
          success: function(response) {

            var len = response.length;

            if (len > 0) {
              var id = response[0]['id'];
              var fprice = response[0]['fprice'];
              var packing = response[0]['packing'];
              var pweight = response[0]['pweight'];

              document.getElementById('fprice_' + index1).value = fprice;
              document.getElementById('packing_' + index1).value = packing;
              document.getElementById('pweight_' + index1).value = pweight;

            }

          }
        });

        return false;
      }
    });
  });

  // Add more
  $('#addmore').click(function() {

    // Get last id 
    var lastname_id = $('.tr_input input[type=text]:nth-child(1)').last().attr('id');
    var split_id = lastname_id.split('_');

    // New index
    var index = Number(split_id[1]) + 1;

    // Create row with input elements
    var html = "<tr class='tr_input'><td><input type='text' class='name' id='name_" + index + "' placeholder='Enter name'></td><td><input type='text' class='phone' id='phone_" + index + "' ></td><td><input type='text' class='address' id='address_" + index + "' ></td><td><input type='text' class='custid' id='custid_" + index + "' ></td></tr>";

    // Append data
    $('tbody').append(html);

  });
});



// Second script to do calculation :

$(document).ready(function() {
  var i = 1;
  $("#add_row").click(function() {
    b = i - 1;
    $('#addr' + i).html($('#addr' + b).html()).find('td:first-child').html(i + 1);
    $('#tab_logic').append('<tr id="addr' + (i + 1) + '"></tr>');
    i++;
  });
  $("#delete_row").click(function() {
    if (i > 1) {
      $("#addr" + (i - 1)).html('');
      i--;
    }
    calc();
  });

  $('#tab_logic tbody').on('keyup change', function() {
    calc();
  });
  $('#tax').on('keyup change', function() {
    calc_total();
  });


});

function calc() {
  $('#tab_logic tbody tr').each(function(i, element) {
    var html = $(this).html();
    if (html != '') {
      var qty = $(this).find('.qty').val();
      var price = $(this).find('.fprice').val();
      var discount = $(this).find('.discount').val();
      $(this).find('.total').val((qty * price) - discount);

      calc_total();
    }
  });
}

function calc_total() {
  total = 0;
  $('.total').each(function() {
    total += parseInt($(this).val());
  });
  $('#sub_total').val(total.toFixed(2));
  tax_sum = total / 100 * $('#tax').val();
  $('#tax_amount').val(tax_sum.toFixed(2));
  $('#total_amount').val((tax_sum + total).toFixed(2));
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<table class="table table-bordered table-hover" style='border-collapse: collapse;' id="tab_logic">
  <thead>
    <tr>
      <th class="text-center">#</th>
      <th class="text-center"> Product </th>
      <th width="190px" class="text-center"> Price </th>
      <th width="30px" class="text-center"> Price for </th>
      <th width="100px" class="text-center"> Packing </th>
      <th width="80px" class="text-center"> Qty </th>
      <th width="100px" class="text-center"> Discount </th>
      <th width="150px" class="text-center"> Total </th>
    </tr>
  </thead>
  <tbody>
    <tr class='tr_input' id='addr0'>
      <td>1</td>
      <td><input type="text" name='product[]' id="prname_1" class="prname form-control" /></td>

      <td>
        <input type="number" name='price[]' id='fprice_1' class="form-control fprice price" step="0.00" min="0" />
      </td>
      <td><input style="width:70px" type="text" class="pweight input-group-text" id="pweight_1"></td>

      <td><input type="text" name='pack[]' class="form-control packing" id='packing_1' step="0" min="0" /></td>

      <td><input type="text" name='qty[]' class="form-control qty" id="qty_1" step="0" min="0" /></td>

      <td><input type="text" name='discount[]' class="form-control discount" id="discount_1" step="0.00" min="0" /></td>

      <td><input type="number" name='total[]' class="form-control total" id="total_1" readonly/></td>
    </tr>
    <tr id='addr1'></tr>
  </tbody>
</table>