2017-07-23 8 views
0

Ich habe eine Tabelle, die dynamisch generiert wird. In seiner Reihe platziere ich Knöpfe.Wie bekomme ich die dynamische Zelle Zelle Wert auf Knopfdruck

for (var i = 0; i < resp.length; i++) {  
    tr = tr + "<tr>";  
    tr = tr + "<td >" + resp[i].Date + "</td>"; 
    tr = tr + "<td >" + resp[i].age + "</td>"; 
    tr = tr + "<td >" + resp[i].Hour + "</td>";    
    tr = tr + "<td><input value='get me' type='button' class='theButton' id='ma' onclick='test()'></td>"; 
    tr = tr + "</tr>"; 
}; 

table

auf eine Schaltfläche klicken, würde Ich mag die bestimmte Zelle Wert dieser Reihe zu bekommen. ZB: Wenn ich auf das Alter in der ersten Reihe klicke, dann ist der Wert 50. Und wenn ich auf den Knopf in der zweiten Reihe klicke, dann sollte ich 94 bekommen.

Wie bekomme ich die Tabelle? Zellwert bei einem Klick auf die Schaltfläche?

Antwort

0

Hier ist Ihre Lösung:

$(document).find('.theButton').on('click',function(){ 
    var age = $(this).parents('tr:first').find('td:eq(1)').text(); 
    console.log(age); 
}); 
+0

In Javascript i tatsächlich benötigt und hier werde ich diesen Wert als Button-Klick-Parameter senden –

+0

Es ist JQuery und was ich in Javascript erforderlich, wie ich das Onclick mit Test() aufrufen werde in dieser Funktion i als Alarm führen wollen oder log –

+0

@AppDev, können Sie entfernen 'onClick' Attribut der Schaltfläche und verwenden Sie diese Funktion jquery. Dies ist ein einzeiliger Code. Also optimiertes. Wird –

0

Sie Alte Schaltfläche Onclick Funktion wie onclick='test('"+resp[i].age +"')'

for (var i = 0; i < resp.length; i++) { 

       tr = tr + "<tr>"; 

       tr = tr + "<td >" + resp[i].Date + "</td>"; 
       tr = tr + "<td >" + resp[i].age + "</td>"; 
       tr = tr + "<td >" + resp[i].Hour + "</td>";    
       tr = tr + "<td><input value='get me' type='button' class='theButton' id='ma' onclick='test("+resp[i].age +")'></td>"; 

       tr = tr + "</tr>"; 


      }; 
+0

in Funktionstest(), wie die Daten zeigen, die ich entweder bekam in Form von alert/console.log –

+0

Funktionstest (Alter) {alert (Alter)} sollten Sie Alter –

+0

@Dinesh geben, will er Alter, aber sie sind vorbei Stunde als Argument. –

1

Hier ist Ihre Lösung für dynamische Tabelle passieren können:

<script language="javascript"> 
    var tbl = document.getElementById("tblId"); 
    if (tbl != null) { 
     for (var i = 0; i < tbl.rows.length; i++) { 
      for (var j = 0; j < tbl.rows[i].cells.length; j++) 
       tbl.rows[i].cells[j].onclick = function() { getval(this); }; 
     } 
    } 

    function getval(cel) { 
     alert(cel.innerHTML); 
    } 
</script> 

So, Mit diesem Javascript können Sie den Wert jeder Tabellenzelle erhalten.

0

dieses Beispiel mit jQuery, ich habe Ihre Funktionstest ersetzt, mit Rowid

https://jsfiddle.net/ucostea/2thyj0ft/

$(document).on("click", ".theButton", function(){ 
     alert("Aage: "+$('.age_'+$(this).attr('rownr')+'').text()); 
}); 
for (var i = 0; i < 10; i++) { 
           var tr = ""; 
       tr = tr + "<tr >"; 

       tr = tr + "<td class='date_"+i+"'>Date" + i + "</td>"; 
       tr = tr + "<td class='age_"+i+"'>Age " + i + "</td>"; 
       tr = tr + "<td class='hour_"+i+"'>Hour " + i + "</td>";    
       tr = tr + "<td><input value='get me' type='button' class='theButton' id='ma' rownr='" + i + "'></td>"; 

       tr = tr + "</tr>"; 
       $('.table tbody').append(tr); 


      }; 
Verwandte Themen