2011-05-07 21 views
5

que estoy usando la plantilla de jQuery plugin de renderizado varios artículos fila similar a esto:jQuery Plantillas - Asociar datos a los elementos DOM plantilla

var clientData = [ 
    { name: "Rey Bango", id: 1 },  
    { name: "Mark Goldberg", id: 2 },  
    { name: "Jen Statford", id: 3 } ]; 

<script id="clientTemplate" type="text/html">  
    <li><${name}</li> 
</script> 

$("#clientTemplate").tmpl(clientData).appendTo("ul"); 

Me pregunto si es posible hacer uso de jQuery's data función para poder asociar cada elemento de la fila a un identificador para actualizar.

Normalmente se podría hacer algo como esto:

$.each(clientData, function(idx, item) { 
    $('<li></li>').appendTo('ul#clientTemplate') 
     .text(item.name) 
     .data('clientId', item.id); 
}); 

$('ul#clientTemplate li').click(function() { 
    updateClient($(this).data('clientId')); 
}); 

Sin embargo, usted no tiene este tipo de control cuando plantillas.

Nota: Prefiero no haría uso de nuevos elementos ocultos para almacenar estos datos en cada fila, o atributos adicionales en los elementos si no es necesario.

Ideas?

Gracias

Respuesta

1

El complemento de jQuery Templates incluye la función tmplItem que le permite volver a los datos reales asociados con cualquier elemento representado por una plantilla.

lo tanto, que sería capaz de hacer algo como:

var client = $("li").first().tmplItem().data 

En este caso client serían sus datos:

{ name: "Rey Bango", id: 1 } 

Muestra aquí: http://jsfiddle.net/rniemeyer/fvhj4/

+0

Gracias, esto es lo Estaba buscando. – cweston

1

Esto podría ser una solución:

$("#clientTemplate").tmpl(clientData).filter("li").each(function(i){ 
    $(this).data(clientData[i].id); 
}).appendTo("ul"); 

Espero que esto ayude. Cheers

Cuestiones relacionadas