Create HTML table from JSON data with JQUERY or Javascript or ANYTHING [duplicate]

Question

Possible Duplicate:
Convert JSON array to an HTML table in jQuery

I'm trying desperately to figure out out to make this table...

I have 3 fields I need to be in the same <td> and another field by itself in a <td>

I am successfully getting the data with JSON to my page with this code:

$.ajax({
  url: 'code.php',
  async: false,
  dataType: 'json',
  success: function (json) {
    window.upc = json.upc;
    window.img_name = json.img_name;
    window.quantity = json.quantity;
    window.description = json.description;
  }


});

How can I get this data to be formatted like I want?

i don't think it is a duplicate, his data structure is different, and would probably take a bit of fanagling to use jqGrid as the answer to that question suggests. — Patricia
– Patricia, Commented Nov 17, 2011 at 21:26
@Devin: Check out jquery.templ it's a solid plugin (yes, only made it to beta, but it's good). api.jquery.com/tmpl. — Patricia
– Patricia, Commented Nov 17, 2011 at 21:29

Jose Vega · Accepted Answer · 2011-11-17 21:26:11Z

0

Check out: http://icanhazjs.com/

STEP 1. - DEFINE YOUR TEMPLATE

<script id="template" type="text/html">
  <table>
    <tr>
         <td>{{quantity}}{{description}}</td><td>{{img_name}}</td>
    </tr>
  </table>
</script>

STEP 2. - RETRIEVE YOUR POPULATED TEMPLATE:

$.ajax({
  url: 'code.php',
  async: false,
  dataType: 'json',
  success: function (json) {
     var yourTable = ich.template(json)
  }
});

You can append the variable yourTable to any element on the page.

answered Nov 17, 2011 at 21:26

Jose Vega

10.3k7 gold badges43 silver badges58 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

bobince Over a year ago

Personally I wouldn't recommend ich at the moment as it seems to be using a version of mustache with a dangerously broken implementation of HTML-escaping. (The escaping in the current version of mustache is also broken, just not in a way that allows exploits.)

Jose Vega Over a year ago

If the problem is the version of mustache, that is easily fixable...I've been using ich for some time now and have not run into the escaping issue.

Devin Prejean Over a year ago

What file do i have to include to use ich.template?

Devin Prejean Over a year ago

I also need it to be in a "while" kind of loop so i can display a random amount of entries

Jose Vega Over a year ago

github.com/andyet/ICanHaz.js/raw/master/ICanHaz.js and yes you can do it in a while loop, just append the template to an object.

Collectives™ on Stack Overflow

Create HTML table from JSON data with JQUERY or Javascript or ANYTHING [duplicate]

1 Answer 1

5 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Linked

Related