2016-03-20 10 views
2

Ich möchte einfach eine row Tabelle nach einem anderen row hinzufügen, wenn der letztere geklickt wird, also habe ich den folgenden Code (tatsächlich verwende ich diesen Code in einer Visualforce-Seite).Wie funktionieren parent() und nest() in jQuery?

function queryAndUpdateLead() { 
     var a = $('[id$=ibrahim]').closest('tr') 
       .after('<tr><td>New Content 1</td><td>\ 
         <a href="#">New Content 2</a></td></tr>'); 
} 

Das hier Problem ist, dass diese Reihe nach alle vorhandenen Zeilen in der Tabelle hinzugefügt wird, und wenn ich die length Eigenschaft verwendet, um die Anzahl der Elemente in a zu überprüfen, habe ich immer 2 (Ich habe zunächst 2 Zeilen)

alert('a.length') // this shows 2 

Was ich will, ist nur die direkte Eltemzeile und nicht alle der bestehenden Reihen zu bekommen, aber ich weiß nicht, warum es nicht funktioniert?

EDIT: DER CODE HTML TRUG BY SALESFORCE SERVER:

<tbody id="j_id0:j_id3:j_id4:j_id6:tb"> 
<tr class="dataRow even first" onfocus="if (window.hiOn){hiOn(this);}" onblur="if (window.hiOff){hiOff(this);}" onmouseout="if (window.hiOff){hiOff(this);} " onmouseover="if (window.hiOn){hiOn(this);} "> 
**<td id="j_id0:j_id3:j_id4:j_id6:0:ibrahim" class="dataCell " onclick="queryAndUpdateLead();" colspan="1">** 
<td id="j_id0:j_id3:j_id4:j_id6:0:j_id7" class="dataCell " colspan="1"> 
<td id="j_id0:j_id3:j_id4:j_id6:0:j_id8" class="dataCell " colspan="1"> 
<td id="j_id0:j_id3:j_id4:j_id6:0:j_id9" class="dataCell " colspan="1"> 
<td id="j_id0:j_id3:j_id4:j_id6:0:j_id10" class="dataCell " colspan="1"> 
</tr> 
<tr class="dataRow odd last" onfocus="if (window.hiOn){hiOn(this);}" onblur="if (window.hiOff){hiOff(this);}" onmouseout="if (window.hiOff){hiOff(this);} " onmouseover="if (window.hiOn){hiOn(this);} "> 
<td id="j_id0:j_id3:j_id4:j_id6:1:ibrahim" class="dataCell " onclick="queryAndUpdateLead();" colspan="1"> 
<td id="j_id0:j_id3:j_id4:j_id6:1:j_id7" class="dataCell " colspan="1"> 
<td id="j_id0:j_id3:j_id4:j_id6:1:j_id8" class="dataCell " colspan="1"> 
<td id="j_id0:j_id3:j_id4:j_id6:1:j_id9" class="dataCell " colspan="1"> 
<td id="j_id0:j_id3:j_id4:j_id6:1:j_id10" class="dataCell " colspan="1"> 
</tr> 
</tbody> 
</table> 
+0

Haben alle Zeilen eine ID, die auf "ibrahim" endet? Weil das der Selektor ist, den du benutzt hast. –

+0

Nein, nur eine Zeile heißt Ibrahim –

+1

Dann zeigen Sie bitte Ihre HTML; und genug jQuery, um dein Problem zu reproduzieren, sonst können wir nur Ratespiele spielen. –

Antwort

0

Wie Sie Sammlung von $('[id$=ibrahim]') Elemente haben, müssen Sie $(this) verwenden, um am nächsten tr von derzeit geklickt Element zu finden und einsetzen, dass der Inhalt nach:

function queryAndUpdateLead() { 
     var $(this).closest('tr') 
       .after('<tr><td>New Content 1</td><td>\ 
         <a href="#">New Content 2</a></td></tr>'); 
} 
+0

JA, es funktioniert dank. –

Verwandte Themen