how to create data templates in html

Question

I am a JS, html beginner and trying to understand how to define/create a html representation of a data object.

Say I have a list of people (in JSON for example) where each person has the following properties: firstName, lastName, age, photo, description.

How would you normally display this list in html?

I assume that somewhere is a div place holder for the list which then gets populated in JS but I'm not sure how the template for the person itself is defined.

Is there a recommended way of doing this sort of thing?

If someone can show me an example that would be great.

Matthias · Accepted Answer · 2012-02-25 10:51:16Z

1

There are plenty of frameworks for templates, e.g.:

jQuery Templates
Mustache
Knockout (my personal favourite)

answered Feb 25, 2012 at 10:51

Matthias

12.3k4 gold badges53 silver badges96 bronze badges

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

Comments

Adaz · Accepted Answer · 2012-02-25 10:41:15Z

1

Have a look at http://handlebarsjs.com/ for a start. This will take your json and format it the way you want.

You can also use jquery Ajax method and then just loop through your results and generate HTML.

answered Feb 25, 2012 at 10:41

Adaz

1,66512 silver badges14 bronze badges

Comments

Kernel James · Accepted Answer · 2012-07-20 04:05:53Z

0

There is also http://code.google.com/p/distal for starters. It has a syntax familiar to HTML coders.

<div data-qtext="obj.firstName"></div>

answered Jul 20, 2012 at 4:05

Kernel James

4,1321 gold badge32 silver badges40 bronze badges

Collectives™ on Stack Overflow

how to create data templates in html

3 Answers 3

Comments

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Related