Pages

Tuesday, March 15, 2011

jQuery - Dynamic Table Creation Using Templates

Sometimes you really need to do things at client side, and one of them could be like a table creation with data on demand. Example, if you do a jQuery Ajax call, receive data in JSON format and present this data in a table, this is a pretty good and clean approach.

The example code goes like this:


































As you can see above, is simple and clean, even if you want to apply classes to <tr> or <td> tags for instance. The expected result from this code is a really dummy table.











References:
http://api.jquery.com/jquery.tmpl/

2 comments:

  1. Hi,

    Nice post. Looks simple.

    I have one question though. I want to handle click event if row is clicked.

    something like this $.template("bodyTemplate",tableRow).onclick()

    Is there a way using jquery.tmpl.js ?

    is it possible?

    Warm Regards,
    Akki

    ReplyDelete
  2. Not with templates like you saying...

    You have to add an onclick at tr in the tableRow var or give an class to the tr and using jquery you bind the event, something like this:

    http://jsfiddle.net/tirso/qjJQp/


    Cheers

    ReplyDelete