Databases
StackOverflow2013
Postsdbo
POCreate contact table from JSON data
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POCreate contact table from JSON data
    text
    copied!<p>I started a demonstration project on HTML, JSON and jQuery recently. Thing I want to achieve now is get data from the JSON file and load it into my table. I am new to JSON so it took me a day to get to nothing, the data was not loaded into my table.</p> <p>Here is my JSON file, 'contact.json':</p> <pre><code>{ "length": 2, "info": [ { "fullname":"Noob Here", "email":"myemail@server.com", "phone":"123456", "badgeid": "11111", }, { "fullname":"Newbie There", "email":"hisemail@server.com", "phone":"589433", "badgeid": "11112", } ] } </code></pre> <p>My script to load data:</p> <pre><code>window.onload = function () { var contacts; setTimeout(loadData(contacts, "contact"), 2000); $(contacts.info).each(function(index, element){ $('#contacts').append('&lt;tr&gt;&lt;td&gt;' + element.fullname + '&lt;/td&gt;&lt;td&gt;' + element.email + '&lt;/td&gt;&lt;td&gt;' + element.phone + '&lt;/td&gt;&lt;td&gt;' + element.badgeid + '&lt;/td&gt;&lt;/tr&gt;'); }) }; function loadData(myobject, myfile){ myobject = $.parseJSON("../data/" + myfile + ".json"); }; </code></pre> <p>Please notice that I may want to load from various JSON file, so loadData have some agruments there. Otherwise, it will parse JSON file directly.</p> <p>I already had a '#contact' table declared in HTML. The error console said:</p> <blockquote> <p>Uncaught SyntaxError: Unexpected token.<br> jQuery.extend.parseJSONjquery.min.js:442<br> loadDataHomepage.html:23<br> window.onload</p> </blockquote> <p>Why is this error appearing? How do I fix this problem?</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload