获取 HTML <td> 标签值到 PHP 变量或 JS 变量

Question

请看下面的编码<table id="datatable" class="table table-striped table-bordered">                            <thead>                            <tr>                               <th>Consignee Name</th>                               <th>Reference Code</th>                               <th>Consignee Number</th>                               <th>Consignee Email</th>                               <th>Consignee Address</th>                               <th>COD</th>                               <th>Pieces</th>                               <th>Wieght</th>                               <th>City</th>                            </tr>                            </thead>我想获取每个数组的数据。我不知道该怎么做。它是一个大数据，如 100 多行。td 中还有一个选择输入，我想获取它的值制作的数组应该是 JavaScript，以便我可以通过 ajax 将值发布到控制器（PHP）

Answer 1

我们可以使用 Javascript 或 jQuery 轻松做到这一点。我正在遵循 jQuery 方法。请参见下面的示例。

 // Perform some action on button click

jQuery('#getValues').click(function(){

//We will iterate over all rows in inside tbody of table with id myTable 

  jQuery('#myTable tbody tr').each(function(index, tr) {

         var lines =jQuery('td', tr).map(function(index, td) {

          return jQuery(td).text();

// This will save all date in lines array

    });

  

// Now test lines array by doing a console.log()

      console.log(lines[0] + ' ' + lines[1] + ' '  + lines[2] + ' '  + lines[3] );

    })

    // Now you have all values in lines array. You can send this complete array via ajax to server.

});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<table id="myTable" border="1">

  <thead>

     <tr>

      <th> Col1 </th>

      <th> Col2 </th>

      <th> Col3 </th>

      <th> Col4 </th>

    </tr>

  </thead>

<tbody>

<tr>

  <td> Value 11 </td>

  <td> Value 12 </td>

  <td> Value 13</td>

  <td> Value 14 </td>

</tr>

<tr>

  <td> Value 21 </td>

  <td> Value 22 </td>

  <td> Value 23</td>

  <td> Value 24 </td>

</tr>

<tr>

  <td> Value 31 </td>

  <td> Value 32 </td>

  <td> Value 33</td>

  <td> Value 34 </td>

</tr>

<tr>

  <td> Value 41 </td>

  <td> Value 42 </td>

  <td> Value 43</td>

  <td> Value 44 </td>

</tr>

</tbody>

</table>

<button id="getValues"> Get all values </button>

所有必要的注释都添加到上面的代码中。您可以根据需要修改示例。

Answer 2

<table id="datatable" class="table table-striped table-bordered">

                            <thead>

                            <tr>

                               <th>Consignee Name</th>

                               <th>Reference Code</th>

                               <th>Consignee Number</th>

                               <th>Consignee Email</th>

                               <th>Consignee Address</th>

                               <th>COD</th>

                               <th>Pieces</th>

                               <th>Wieght</th>

                               <th>City</th>

                            </tr>

                            </thead>

                            <tbody>

                                <form action="<?=base_url()?>client/save_excel_date" method="POST">

                                <?

                                $count=1;

                                    foreach($sheet_data as $sheet){

                                ?>

                                    <tr>

                                        <td><input class="form-control" name="sheetc[a<?=$count?>]" value="<?=$sheet['C']?>"></td>

                                        <td><input class="form-control" name="sheetd[a<?=$count?>]" value="<?=$sheet['D']?>"></td> 

                                        <td><input class="form-control" name="sheete[a<?=$count?>]" value="<?=$sheet['E']?>"></td>

                                        <td><input class="form-control" name="sheetf[a<?=$count?>]" value="<?=$sheet['F']?>"></td>

                                        <td><input class="form-control" name="sheetg[a<?=$count?>]" value="<?=$sheet['G']?>"></td>

                                        <td><input class="form-control" name="sheeth[a<?=$count?>]" value="<?=$sheet['H']?>"></td>

                                        <td><input class="form-control" name="sheeti[a<?=$count?>]" value="<?=$sheet['I']?>"></td>

                                        <td><input class="form-control" name="sheetj[a<?=$count?>]" value="<?=$sheet['J']?>"></td>

                                        <td>

                                            <select class="form-control select2" name="city_id[a<?=$count?>]">

                                                <?php

                                                    foreach ($cities as $city) {

                                                    ?>

                                                    <option value="<?=$city['ref_id']?>" <?

                                                    if($sheet['L']==$city['name'])

                                                    echo 'selected';

                                                    ?>><?=$city['name']?></option>

                                                    <?php

                                                    }

                                                    ?>

                                            </select>

                                        </td>

                                    </tr>

                                    <?

                                    $count++;

                                    }

                                    ?>

                                    <input type="submit" value="Save">

                                    </form>

                            </tbody>

                        </table>

并且在控制器中

$data   =   $this->input->post();

    $consignee_name     =   $data['sheetc'];

    $consignee_ref     =   $data['sheetd'];

    $consignee_number     =   $data['sheete'];

    $consignee_email     =   $data['sheetf'];

    $consignee_address     =   $data['sheetg'];

    $cod     =   $data['sheeth'];

    $pcs     =   $data['sheeti'];

    $weight     =   $data['sheetj'];

    $city_id     =   $data['city_id'];

    $arrays     =   array_merge_recursive($consignee_name,$consignee_ref,$consignee_number,$consignee_email,$consignee_address,$cod,$pcs,$weight,$city_id);

    print("<pre>".print_r($arrays,true)."</pre>");die;