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

时间:2018-04-30 09:33:13

标签: php jquery html5 codeigniter

我使用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>

1 个答案:

答案 0 :(得分:0)

使用服务器端脚本(如php)在新页面上获取数据并将其转换为json。使用jquery循环功能进行循环并在UI上附加数据