在动态字段中显示获取数据

Question

我正在使用 Jquery 生成这些动态字段，并将它们的数据以 JSON 格式存储以用于发票记录，并且我想在从数据库获取更新过程后将存储的数据显示回这些字段中。 请帮助我该怎么做？

查看：

<div class="row">
      <div class="col-sm-12 table-responsive">
        <div class="box-tools">
              <button class="btn btn-xs btn-primary tableaction" data-action="add"><i class="fa fa-fw fa-plus"></i> Add More Items</button>
              <button class="btn btn-xs btn-danger tableaction" data-action="remove"><i class="fa fa-fw fa-minus"></i> Remove Last One</button>
            </div>
        <table class="table table-striped">
          <thead>
          <tr>
            <th>Sr.#</th>
            <th>ITEM DESCRIPTION</th>
            <th>HSN/SAC Code</th>
            <th>Unit</th>
            <th>Qty</th>
            <th>Rate</th>
            <th>Amount</th>
          </tr>
          </thead>
          <tbody class="invoiceitems">
            <tr class="invoiceitemdetail">
              <td class="sno">1</td> 
              <td><?=form_input(array('name' => 'itemdesc[]','id' => 'itemdesc','type' => 'text','class' => 'form-control','placeholder' => 'Enter detail','value' => set_value('itemdesc[]')))?></td>
              <td><?=form_input(array('name' => 'saccode[]','id' => 'saccode[]','type' => 'text','class' => 'form-control','placeholder' => 'Enter SAC Code','value' => set_value('saccode[]')))?></td>
              <td><?=form_input(array('name' => 'units[]','id' => 'units[]','type' => 'text','class' => 'form-control inputcalqty','placeholder' => 'Enter Quantity','value' => set_value('units[]')))?></td>
              <td><?=form_input(array('name' => 'quantities[]','id' => 'quantities[]','type' => 'text','class' => 'form-control inputcalunit','placeholder' => 'Enter Units','value' => set_value('quantities[]')))?></td>
              <td><?=form_input(array('name' => 'rates[]','id' => 'rates[]','type' => 'text','class' => 'form-control inputcalprice','placeholder' => 'Enter Price','value' => set_value('rates[]')))?></td>
              <td><?=form_input(array('name' => 'amount[]','id' => 'amount[]','type' => 'text','class' => 'form-control inputtotalamount','placeholder' => 'Total Amount','value' => set_value('amount[]')))?></td>
            </tr>
          </tbody>
        </table>
      </div>
</div>

Jquery：

<script>
        $('button[data-action="remove"]').hide();
        $('#invoicecreation').on('click','.tableaction',function(e){
          e.preventDefault();
          //console.log(appendctrl);
          $('button[data-action="remove"]').show();
          var dataact= $(this).data('action');
          var totaltablerecords = $('.invoiceitemdetail').length;
          var appendctrl = $('.invoiceitemdetail').eq(0).clone().find("input").val("").end();
          if(dataact === 'add'){
            $(appendctrl).appendTo('.invoiceitems');  
          }else if(dataact === 'remove'){
            if(totaltablerecords > 1){
              $('.invoiceitemdetail:last-child').remove();
              if($('.invoiceitemdetail').length ==1){
                $('button[data-action="remove"]').hide();
              }
            }else{
              $('button[data-action="remove"]').hide();
            }
          }
          $("td.sno").each(function(index,element){                 
            $(element).text(index + 1); 
          });

        });
</script>

Answer 1

使用像 php 这样的服务器端脚本来获取新页面上的数据并将其转换为 json。使用 jquery 循环功能循环并在 UI 上附加数据