簡體   English   中英

使用AJAX更新多個HTML表行

[英]Update multiple HTML table rows using AJAX

我有一張表,顯示從PHP腳本提取的信息,如下所示:

<tr class="online" id="0011e31xxxxx">
  <td><input type="checkbox" name="mac" value="0011e31xxxxx"></td>
  <td>1234567</td>
  <td>Modelnumber</td>
  <td>0011.e31x.xxxx</td>
  <td>10.x.x.x</td>
  <td>UBR4</td>
  <td>online</td>
  <td><a href="javascript:void(0);" onclick="getInfo('0011e31xxxxx','10.x.x.x','UBR4','resetubr');"><img src="/own/v2.2/images/reset.gif"></a></td>
  <td><a href="javascript:void(0);" onclick="getInfo('0011e31xxxxx','10.x.x.x','UBR4','resetsnmp');"><img src="/own/v2.2/images/reset.gif"></a></td>
  <td><a href="javascript:void(0);" onclick="getInfo('0011e31xxxxx','10.x.x.x','UBR4','refresh');"><img src="/own/v2.2/images/icone_refresh.png"></a></td>
</tr>

3個getInfo調用鏈接如下,它們可以正常工作:

<script>
function getInfo(id,adresseip,ubr,action) {
        var rowid = "tr#" + id;
        $.ajax({
            type: "GET",
            cache: false,
            url: 'index.php',
            data: "macaddress=" + id + "&ubr=" + ubr + "&adresseip=" + adresseip + "&action=" + action,
            beforeSend: function() {
                $(rowid).addClass("loading");
            },
            success: function(data) {
                $(rowid).replaceWith(data);
            }
        });
}
</script>

我想做的是使用每個<tr>開頭的復選框,以生成某種循環來運行每一行上看到的三個鏈接之一。

假設我選中了3個框(值123、234和345),我需要<tr id=123><tr id=234> and <tr id=345>僅在其余數據保留時更新它們各自的行完整。

是否可以進行這樣的循環以調用AJAX函數,使其運行與選定復選框一樣多的次數? 或者,AJAX函數可以遍歷每個選中的復選框,以便一個接一個地更新它們嗎?

謝謝

請在Google上搜索,然后嘗試...如果您沒有得到任何答案,請提出問題...

檢查此鏈接。

$('#TableID > tr').each(function() {
    var postData = {
    'FirstName':$(this).find('#FirstName').val(),
    'SurName':$(this).find('#Surname').val()
    };
    $.ajax({
    type: "POST",
    cache: false, 
    url: "WuFoo.aspx",
    data: postData ,
    success: success
    });
 });

您可以通過執行以下操作來使用JQuery選中所有選中的復選框

$("input[type=checkbox]:checked")

然后,您可以使用.each遍歷它們並更新每個適當的行。

該代碼應該可以success: ajax調用的功能。

或者,您可以使用相同的JQuery代碼來獲取復選框,然后在.each選擇<tr>並使用該數據進行Ajax調用。

暫無
暫無

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

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