multi-dimensional array +concat

http://stackoverflow.com/questions/10035933/binding-multidimensional-knockoutjs-observablearray

by ian_smithz

HTML

<script src="http://knockoutjs.com/downloads/knockout-2.0.0.js"></script>
<table>
    <tr>
        <th>index</th>
        <th>fajr</th>
        <th>zuhr</th>
        <th>asr</th>
        <th>maghrib</th>
        <th>isha</th>
    </tr>
    <tbody data-bind="foreach: prayerData">
        <tr>
            <td data-bind="text: index"></td>  <!-- Display the current row -->
            <td data-bind="text: fajr"></td>
            <td data-bind="text: zuhr"></td>
            <td data-bind="text: asr"></td>
            <td data-bind="text: maghrib"></td>
            <td data-bind="text: isha"></td>
        </tr>
    </tbody>
</table>

CSS

td, th { padding: 2px; }

JavaScript

var dataFromServer = {
    "cat": {
        "asr": "15:50",
        "fajr": "03:00",
        "isha": "21:31",
        "maghrib": "19:02",
        "zuhr": "12:21"
    },
    "dog": {
        "asr": "15:51",
        "fajr": "02:55",
        "isha": "21:35",
        "maghrib": "19:04",
        "zuhr": "12:21"
    },
    "minkey": {
        "asr": "15:53",
        "fajr": "02:51",
        "isha": "21:39",
        "maghrib": "19:07",
        "zuhr": "12:21"
    },
    "sausage": {
        "asr": "15:54",
        "fajr": "02:46",
        "isha": "21:42",
        "maghrib": "19:09",
        "zuhr": "12:20"
    }
};



var ViewModel = function(data) {
    
    //map data to an array
    var mappedToArray = [];
    $.each(data, function(index, item) {
        mappedToArray.push(item);
        item.index = index;
    });
           
    this.prayerData = ko.observableArray(mappedToArray);          
};

ko.applyBindings(new ViewModel(dataFromServer));



var a = [ [1, 2], [3, 4] ];

var b = [ ["a", "b"], ["c", "d"] ];

b = b.concat(a);
//console.log(b);
//console.log(b[2]); // result 2
//console.log(b[2][1]); // result 2


// The following object masquerades as an array.
var fakeArray = { "length": 2, 0: "Addy", 1: "Subtracty" };
 
// Therefore, convert it to a real array
var realArray = $.makeArray( fakeArray )
 
// Now it can be used reliably with $.map()
$.map( realArray, function( val, i ) {
  console.log(realArray);
});