Databases
StackOverflow2013
Postsdbo
POKnockout Mapping Plugin to show data in a table
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POKnockout Mapping Plugin to show data in a table
    text
    copied!<p>I have data coming from JSON as:</p> <pre><code>[ {"ProjectName":"Region1.Site1","Turbine":"T1","Fault":0,"Description":"No Fault"}, {"ProjectName":"Region1.Site1","Turbine":"T2","Fault":0,"Description":"No Fault"}, {"ProjectName":"Region1.Site1","Turbine":"T3","Fault":1,"Description":"In Alarm"}, {"ProjectName":"Region1.Site1","Turbine":"T4","Fault":1,"Description":"In Alarm"}, {"ProjectName":"Region1.Site2","Turbine":"T1","Fault":0,"Description":"No Fault"}, {"ProjectName":"Region1.Site2","Turbine":"T2","Fault":0,"Description":"No Fault"}, {"ProjectName":"Region1.Site2","Turbine":"T3","Fault":1,"Description":"In Alarm"}, {"ProjectName":"Region1.Site2","Turbine":"T4","Fault":1,"Description":"In Alarm"} ] </code></pre> <p>I would like to show this data into a table with table headers as <code>Project Name</code>, <code>Turbine</code>, <code>Fault</code>, <code>Description</code>.</p> <p>I am using Knockout.js and the <a href="http://knockoutjs.com/documentation/plugins-mapping.html" rel="nofollow">mapping plugin</a> as well. Here's a <a href="http://jsfiddle.net/WaQJp/1/" rel="nofollow">JSFiddle to show what I tried so far</a>.</p> <p>I have mainly two goals</p> <ol> <li>Put this data into table</li> <li>Update the row whenever the Fault status changes. Each row is uniquely identified by combination of ProjectName and Turbine.</li> </ol> <hr> <p>Thanks Sandeep.</p> <p>I am having problem with this statement where I try to using mapping plugin.</p> <p><code>var viewModel = {};</code></p> <p><code>viewModel.Stats = ko.mapping.fromJS(data);</code></p> <p>Can you please tell me what I am doing wrong. Also when I receive updates in data, does the following statement work ?</p> <p><code>ko.mapping.fromJS(data,viewModel);</code></p> <p>Since the mapping plugin was not working , I had to use ko.utils.Arraymap function.</p> <p>Thanks</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