How to handle datasource with dynamic url using MVVM

2 posts, 0 answers
  1. Kenneth
    Kenneth avatar
    101 posts
    Member since:
    Apr 2014

    Posted 05 Oct Link to this post

    I have a simple hybrid app with a list bound to a datasource using the MVVM pattern per the beginner examples.

    The list is a list of clients, and depending on a parameter to the restfull call (in the data: part of the view model) the list could return recent clients or the result of a keyword search.

    What I tried to do was have a global search variable, if blank the call would return recent clients, and if equal to something like "?search=test"would return a list of all clients with the characters 'test' in their name.

    Problem is the url: portion seems to evaluated only once as the element is bound because when I change the search variable it is not being passed to the restful API.

    I set the search variable then I call this to refresh (which it does but with the search=empty)

            $("#recentClientList").data("kendoMobileListView").dataSource.read();
            $('#recentClientList').data('kendoMobileListView').refresh();

    I thought alternately I could create a datasource on the fly set the new datasource on the <ul> list, but I don't know how to bind the new datasource to the <ul> element.

    data: new kendo.data.DataSource({

            transport: {
                read: {
                    url: app.uri + "clients" + app.search,  
                    type: "get",
                    dataType: "json",
                }
            },
            schema: {
                data: function (response) {
                    var obj = $.parseJSON(response);
                    return obj;
                }
            }
        })

     

  2. Kenneth
    Kenneth avatar
    101 posts
    Member since:
    Apr 2014

    Posted 05 Oct Link to this post

    SOLVED:

    This seems like a very common situation and the solution is simple but not very obvious:

    replacing url: app.uri + "clients" + app.search,  with url: function () {return app.uri + "clients" + app.search}, works.

    I'm sure there is some very good technical explanation for this but I can't imagine what it would be.

Back to Top