簡體   English   中英

如何獲取html表的行id

[英]How to get the row id of html table

假設我有一些來自數據庫的數據並存儲在一個數組中,如下所示:

$testArray = array(
    array('0', 'name1', 'status1'),
    array('1', 'name2', 'status2')
);

我可以像這樣打印數組的內容作為html表:

Id  name    status
0   name1   status1 
1   name2   status2 

我想在每行末尾使用“狀態”下拉列表來更改每個條目的狀態,並更新到數據庫表中。 我的問題是:當我選擇drodown列表的選項時,如何獲取每一行的行ID('Id'列)? 如何將這些信息傳遞給后端以更新數據庫表? 我想它應該使用一些JavaScript。 以下是代碼:

<?php

$testArray = array(
    array('0', 'name1', 'status1'),
    array('1', 'name2', 'status2')
);
?>

<html>
    <head>   
    </head>
    <body>
        <table>
            <tr>
                <td>Id</td>
                <td>name</td>
                <td>status</td>
            </tr>
            <?php
            for ($i = 0; $i < count($testArray); $i++){
                echo '<tr>';
                for ($j = 0; $j < count($testArray[$i]); $j++){
                    echo '<td>';
                    echo $testArray[$i][$j];
                    echo '</td>';
                }
                echo '<td>';
                echo '<select>';
                echo "'<option value='0'>status1</option>";
                echo "'<option value='1'>status2</option>";
                echo '</select>';
                echo '</td>';
                echo '</tr>';
            }
            ?>
        </table>
    </body>
</html>

感謝幫助!

您可以:

  1. 將行id存儲在第一列的隱藏字段中,使用jQuery存儲get
  2. 存儲為id屬性,然后使用jQuery獲取值
  3. (我認為最好的一個)將id存儲在select控件的id屬性中,然后使用jQuery獲取所選索引更改的值

    在HTML中你將有:

    <select id="1">

    在javascript中:

     $('select').change(function () { var id = $(this).attr('id'); // post id to the server using ajax (you can use jQuery ajax request) }); 

你可以:

  1. 為每個select選擇一個與數據行對應的id。

  2. 在更改(jQuery)時,獲取select的值,並使用jquery ajax調用將rowID和'StatusValue'發送到處理頁面。

  3. 顯示返回數據的狀態消息。

http://api.jquery.com/jQuery.ajax/

- 建立選擇

<?php
            for ($i = 0; $i < count($testArray); $i++){
                echo '<tr>';
                for ($j = 0; $j < count($testArray[$i]); $j++){
                    echo '<td>';
                    echo $testArray[$i][$j];
                    echo '</td>';
                }
                echo '<td>';
                **echo '<select id="' + $testArray[$i][0] + '">';**
                echo "'<option value='0'>status1</option>";
                echo "'<option value='1'>status2</option>";
                echo '</select>';
                echo '</td>';
                echo '</tr>';
            }
?>

- jQuery(你需要jquery文件,從jquery.com下載)

$(document).ready(function(){
    $('select').change(function () {
        var rowIdVal = $(this).attr('id');  // the id of the select (your rowID)
        var statusVal = $(this).val();  // the value of the select

        // post id to the server using ajax (you can use jQuery ajax request)
        ////I would check if the values are valid and not null...
        $.ajax({
           type: "POST",
           url: "YOURHANDLERFILE.php",
           data: {status: statusVal, rowId: rowIdVal},
           success: function(d){     
                //show a status message     
           }
         });
    });
});

我會做點什么的

$('#yourTableId').find('select').change(function() { //bind a change event to the selects
   $(this).closest('tr') //this way you get the tr element of the row you changed the select value
        .find('td:first') //or .find('td').first(). This will give you the td element for the Id column
        .val(); //The actual value of the td Id element
});

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM