Phonejs binding data

Question

I'm testing phonejs, so I downloaded latest version from website and inside demo folder there is RealtoApp example. I'm looking inside it and I'm a bit confused.

Inside data folder there is one javascript file called sampleData.js, it defines in RealtorApp.data.SampleData = { ... } all static information to process , is there an easy way to binding remotely this information instead of this static data ?? The most part of this is javascript, jquery and knockout so I'm sure you are the bests in that.

I swear I have looked all tutorials and I just find new DevExpress.data.Datasource object with the load function and getJson method, I think that it's the way but it would be great to know how to merge this in the RealtoApp demo.

Some help ?

Answer 1

The static data (RealtorApp.data.SampleData) is used by data access layer defined in dataLayer.js

The dataLayer is a bunch of functions that emulates asynchronous data access. So you can just implement them with $.getJSON or any other async call to the server. Just replace setTimeout with your async call, e.g.

function getPropertiesByCoordinates(latitude, longitude) {
    var result = $.Deferred();

    $.getJSON("your url", function(data) {
        var properties = [];
        $.each(data, function(_, value) {
            properties.push(new RealtorApp.data.PropertyViewModel(value));
        });
        result.resolve(data);
    });

    // INSTEAD OF 
    //setTimeout(function() {
    //    var properties = [];
    //    $.each(RealtorApp.data.SampleData, function(_, value) {
    //        properties.push(new RealtorApp.data.PropertyViewModel(value));
    //    });
    //    result.resolve(properties);
    //}, TIMEOUT);

    return result.promise();
}

If you wish to find an example how to work with real remote service look at Skate Shop Demo https://www.devexpress.com/Products/HTML-JS/demos.xml#!demo=devextreme-skate-demo

Actually, PhoneJS has strong data layer (from static js arrays to rest services). Check out following links http://phonejs.devexpress.com/Documentation/Howto/Data_Layer?version=13_2#Data_Layer http://phonejs.devexpress.com/Documentation/Howto/Data_Source_Examples?version=13_2#Data_Source_Examples