Javascript change函数从数据库填充表单字段，该数据库不使用Js动态添加的行

我有一个表单，用户将一个类别输入到表单字段类别中，表单上的其他字段（如rate、tarriff代码等）由数据库中的信息填充，到目前为止，我的工作还不错，我的问题是表单允许用户为另一个类别动态添加带有这些字段的行，但在创建该行之后，当我尝试输入另一个类别时，没有发生任何事情，其他字段没有像第一行那样填充

这是我正在使用的代码。这可以获取一行的信息，但其他行什么都不会发生

  <script type="text/javascript">
      $(function() { // This code will be executed when DOM is ready
          $('#categories').change(function() { // When the value for the     
              categories element change, this will be triggered
                 var $self = $(this); // create a jQuery object with the 
                    select inside
                  $.post("getTariffcd.php", { categories : $self.val()}, 
               function(json) {
                if (json && json.status) {
                    $('#tariffcd').val(json.tariff);
                    $('#sub_heading').val(json.subhead);
                    $('#rate').val(json.rate);
                    $('#elevy').val(json.elevy);
                }
             })
          });
        })
    </script>

$（function（）{//DOM就绪时将执行此代码
$（'#categories'）。当
类别元素更改，这将被触发
var$self=$（this）；//使用
选择内部
$.post（“gettarifcd.php”，{categories:$self.val（）}，
函数（json）{
if（json&&json.status）{
$（'#tariffcd'）.val（json.tariffcd'）；
$（'分标题'）.val（json.分标题）；
$（'#rate'）.val（json.rate）；
$（'#elevy'）.val（json.elevy）；
}
})
});
})

我的getTariffcd.php是这样的

    <?php
          $pdo = new PDO("mysql:host=localhost;dbname=customs;charset=utf8", 
              "root", "");

              header("Content-Type:application/json; Charset=utf-8");

                 $st = $pdo->prepare("SELECT tariffcd, sub_heading, rate,  
                       elevy FROM lt_products WHERE categories = 
                         :categories");
                             $st->execute(array ('categories' =>  
                                  $_POST['categories']));
                                     $data = $st->fetch(PDO::FETCH_ASSOC);
                                         echo json_encode(array ('status' => 
                          true, 'tariff' => $data ['tariffcd'], 'subhead' =>  
                  $data ['sub_heading'], 'rate' => $data ['rate'], 'elevy' 
             => $data ['elevy']));

关税光盘：


副标题：


费率：


环境的：


$
     <p>        
          <?php //connect to mysql database
               $connection = 
                    mysqli_connect("localhost","root","","customs")or 
                             die("Error " . mysqli_error($connection));
                               //fetch data from database
                       $sql = "select categories from lt_products";
                     $result = mysqli_query($connection, $sql) or die("Error 
          " . mysqli_error($connection));?>

         <input type="text" list="productcategories"   name="categories[]"   
              class="form-control"  id="categories" placeholder="Type Name 
                  of Product" >
                          <datalist id="productcategories">

                              <?php while($row = mysqli_fetch_array($result, 
                                           MYSQLI_ASSOC)){ ?>
               <option value="<?php echo $row['categories']; ?>"><?php echo 
              $row['categories']; ?></option> <?php } ?>
          </datalist>
    <?php mysqli_close($connection); ?>

     </p>   
        Tariff CD:
        <input type="text" class="form-control" name="tariffcd[]" 
              disabled="disabled" id="tariffcd">
     </p>
      <p>
        Subheading:
         <input type="text" class="form-control" name="sub_heading[]" 
              disabled="disabled" id="sub_heading">
      </p>
      <p>
         Rate:
         <input type="text" class="form-control" name="rate[]" 
             disabled="disabled" id="rate">
      </p>
      <p>
         Environmental:
          <input type="text" class="form-control" name="elevy[]" 
              disabled="disabled" id="rate">
      </p>
       <p>
          <div class="input-group">
              <div class="input-group-addon">$</div>
                      <input type="text" name="cost" class="form-control" 
                         id="cost" size="6" maxlength="6" onKeyPress="return  
                           isNumberKey1(event)" placeholder="Cost" <?php if 
                     (isset($_POST['cost'])) echo "value=\"" . 
                  $_POST['cost'] . "\"" ?>>
            <div class="input-group-addon">.00</div>
        </div>
     </p>
         <button class="btn btn-success btn-add" type="button">
                        <span class="glyphicon glyphicon-plus"></span>
                    </button>
               <br>
           <small>Press <span class="glyphicon glyphicon-plus gs"></span> to 
               add another Item to form :)</small>
                </div>
            </div>
         </div>
     </div>

$(function()
 {
   $(document).on('click', '.btn-add', function(e)
  {
    e.preventDefault();

    var controlForm = $('.controls form:first'),
        currentEntry = $(this).parents('.entry:first'),
        newEntry = $(currentEntry.clone()).appendTo(controlForm);

    newEntry.find('input').val('');
    controlForm.find('.entry:not(:last) .btn-add')
        .removeClass('btn-add').addClass('btn-remove')
        .removeClass('btn-success').addClass('btn-danger')
        .html('<span class="glyphicon glyphicon-minus"></span>');
   }).on('click', '.btn-remove', function(e)
  {
    $(this).parents('.entry:first').remove();

       e.preventDefault();
        return false;
    });
 });