aktualisieren mehrere Zeilen HTML-Tabelle mit AJAX

Question

Ich habe eine Tabelle, die Informationen von einem PHP-Skript wie so gezogen zeigt:

<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> 

Das 3 getInfo ruft Links sind wie folgt und perfekt funktionieren:

<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> 

Was ich versuche, ist das Kontrollkästchen am Anfang jeder <tr> zu aktivieren, um eine Art von Schleife zu generieren, um einen der drei Links in jeder Zeile zu sehen.

Sagen wir, ich überprüfe 3 Boxen (Wert 123, 234 und 345), ich brauche die <tr id=123><tr id=234> and <tr id=345>, um ihre jeweiligen Zeilen nur zu aktualisieren, während der Rest der Daten intakt bleibt.

Ist es möglich, eine solche Schleife so zu erstellen, dass die AJAX-Funktion so oft ausgeführt wird, wie es ausgewählte Kontrollkästchen gibt? Oder kann die AJAX-Funktion über jedes ausgewählte Kontrollkästchen iterieren, um sie nacheinander zu aktualisieren?

Danke

Answer 1

Bitte auf die Google-Suche dann versuchen ... wenn Sie eine Antwort nicht bekommen, dann die Frage stellen ...

Check this Link..

$('#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 
    }); 
}); 

Answer 2

können Sie Aktivieren Sie alle Kontrollkästchen mit JQuery, indem Sie etwa

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

Sie können dann .each verwenden, um über sie zu iterieren und jede geeignete Zeile zu aktualisieren.

Dieser Code sollte in Ihrer success: Funktion Ihres Ajax Anruf gehen.

Alternativ können Sie denselben JQuery-Code verwenden, um die aktivierten Kontrollkästchen zu erhalten, und dann <tr> in .each auswählen und diese Daten verwenden, um einen Ajax-Aufruf durchzuführen.