2010-04-24 36 views
19

Tengo un table.Jquery agregue la fila de la tabla después de la fila que llama al jquery

<table id="servers" ...> 
... 
{section name=i loop=$ownsites} 
<tr id="site_id_{$ownsites[i].id}"> 
... 
<td>{$ownsites[i].phone}</td> 
<td class="icon"><a id="{$ownsites[i].id}" onClick="return makedeleterow(this.getAttribute('id'));" ...></a></td> 
</tr>  
{/section} 
<tbody> 
</table> 

Y este JavaScript.

<script type="text/javascript"> 
function makedeleterow(id) 
    { 
     $('#delete').remove(); 
     $('#servers').append($(document.createElement("tr")).attr({id: "delete"})); 
     $('#delete').append($(document.createElement("td")).attr({colspan: "9", id: "deleter"})); 
     $('#deleter').text('Biztosan törölni szeretnéd ezt a weblapod?'); 
     $('#deleter').append($(document.createElement("input")).attr({type: "submit", id: id, onClick: "return truedeleterow(this.getAttribute('id'))"})); 
     $('#deleter').append($(document.createElement("input")).attr({type: "hidden", name: "website_del", value: id})); 
    } 
</script> 

Está funcionando bien, se hace una tr después de la table 's última tr y pone la información a ella, y la función de borrado también funciona bien.

Pero me gustaría hacer esta append DESPUÉS la tr (con tdclass="icon"), que está llamando el guión. ¿Cómo puedo hacer esto?

+0

Creo que no te entiendo. poner el uso .next() o siguiente ('tr') supongo. PD: y no tiene que volver a seleccionar sus elementos más de una vez. puede reemplazar $ (document.createElement ('tr')) por $ ('') .attr ('id', 'delete') – meo

+1

Sí, @meo. En lugar de $ ("# deleteter") muchas veces, simplemente haz var deleter = $ ("# delegate"); luego usa la referencia de la variable cada vez. – Geoff

+0

fi hacer esto con '$ ('# site_id _' + id) .after(). Append ($ (document.createElement (" tr ")). Attr ({id:" delete "}));' o con ' next() 'se agregará dentro del' tr' después de 'td class =" icon "'. –

Respuesta

33

Puede usar la función .after() en jQuery para agregar contenido después de otro elemento.

Así que en lugar de

$("servers").append(...); 

que usaría

$("#" + id +).closest("tr").after(...); 

o también se podría utilizar

$(...).insertAfter($("#" + id).closest("tr")); 

que es esencialmente equivalente.

Ver http://api.jquery.com/after/ para más detalles.

+0

'$ ('# site_id _' + id) .after(). Append ('');' Todavía no funciona. ¿Alguna otra idea? –

+0

Creo que necesitas poner tu en el después() y dejar el append(). –

+3

Sí, agregue el contenido como el argumento del método posterior, no hay necesidad de aplicar el método. Algo así como: var newTr = $ (""); $ ('# site_id _' + id). after (newTr); newTr.append (someChildOfTr) .append (someOtherChildOfTr); – Geoff

3

tratar .prepend() en lugar de .append()

0

interst tr Identificación continuación onclick = "xyz()"

algo como esto:

<tr id="" onclick="xyz()"><td></td><td></td></tr> 
<script> 
    function xyz() 
    { 
    var newrow = "<tr><td>data1</td><td>data1</td></tr>";   
    $("#tr_id").after(newrow); 
    } 
</script> 
Cuestiones relacionadas