Home > DeveloperSection > Forums > How to insert an List of string array into a table rows in Javascript
jayprakash sharma
jayprakash sharma

Total Post:117

Posted on    December-17-2013 12:49 AM

 JavaScript JavaScript 

 1 Reply(s)
 1237  View(s)
Rate this:

Hi I have a MVC project and I am calling a POST to get data from server-side which works great!

I have a bootstrap css table to which I want to bind all the data in the call back function for POST.

Below is my code snippet:


dataButton.on("click", function GetTRS() {

        var objectID = updateFeature.attributes.OBJECTID;

        var Direction = updateFeature.attributes.DIR;

        var Township = updateFeature.attributes.TWNSHP;

        var Range = updateFeature.attributes.RNG;

        var Section = updateFeature.attributes.SECTION_;

        $.post("/Home/Index", { "T": Township, "R": Range, "S": Section }, function (data) {}, 'json');



div class="container">

<table class="Computed CIR table table-bordered">



            <th style="text-align: center"><b>Crop</b></th>

            <th style="text-align: center"><b>ET (inches)</b></th>

            <th style="text-align: center"><b>Eff.Rain (inches)</b></th>

            <th style="text-align: center"><b>CIR (inches)</b></th>

            <th style="text-align: center"><b>Recharge (inches)</b></th>



    <tbody data-bind="foreach: data">


            <td style="text-align: center" data-bind="text: opCropName"></td>

            <td style="text-align: center" data-bind="text: opET"></td>

            <td style="text-align: center" data-bind="text: opEffRain"></td>

            <td style="text-align: center" data-bind="text: opCIR"></td>

            <td style="text-align: center" data-bind="text: opRecharge"></td>




The data returned from post is a LIST of string arrays with each array having the five data types I am trying to bind to the cells in each row of the table.

Thank you in advance!!

Pravesh Singh

Total Post:412

Posted on    December-17-2013 1:29 AM

Hi jayPrakash,


The data that comes back in your callback needs to be attached to your viewmodel somehow. I'm not sure how you're creating your viewmodel, but if you have something like this:

var vm = {

    data: ko.observableArray([])


then you'd need to update that data array in your ajax callback.


       { "T": Township, "R": Range, "S": Section },

       function (data) { vm.data(data); }, 'json');


That assumes that your data observable array is holding plain old JavaScript objects, which is fine. If however you need these objects to be mapped over to objects with knockout observables, then you'd have to map it somehow. You could either map everything over manually, or use knockout's mapper.

Modified On Aug-11-2016 05:11:32 AM

Don't want to miss updates? Please click the below button!

Follow MindStick