I am working on a Hybrid using appbuilder. I have a Web 2.0 C# api that is my remote datasource. I have preferences that I store in local storage to keep track of some query parameters that I send to my api in the header. All that works however the only way it has worked has been with data-refresh="true" which ends up eating up a lot of data when a visit to the page really did not have any parameter changes. HOWEVER when I set that to "false", it only reads from the server once, even after I have made a change to the query parameter.
I have refactored my code to try and simplify ... I think I want to call a refresh or read only at the init of the view AND when the settings change (thus needing to send server new query parameters).
Please help.
html
<divid="mylist"data-role="view"data-init="initList"data-show="viewShow"data-layout="main-leads"> <ulid="remoteListView"data-role="listview"data-template="template"data-endless-scroll="true"></ul> </div> <scriptid="template"type="text/x-kendo-template"> #: data['LastName'] #, #: data['FirstName'] # </script>js script
'use strict';varMydataSource = newkendo.data.DataSource({ transport: { read: { url: function() { varurlnow = app.baseURL() + "MyLeads/"; varsuffix; varprefs = app.getAuthSettings(); if(prefs != null) { suffix = prefs.agentid; } else{ // should call the login screen alert("You need to Login."); } returnurlnow + suffix; }, // the request type type: "get", // the data type of the returned result dataType: "json", beforeSend: function(xhr) { varencodedAuth = app.getBasicAuth(); xhr.setRequestHeader('Authorization', encodedAuth); varpageSize = 0; vardaysBack = 0; varfilter = ""; varprefs = app.getSettings(); if(prefs != null) { pageSize = prefs.pagesize; daysBack = prefs.daysback; filter = prefs.filter; } xhr.setRequestHeader('Pagesize', pageSize); xhr.setRequestHeader('Daysback', daysBack); xhr.setRequestHeader('Filter', filter); } } }, schema: { model: { fields: { 'LastName': { field: 'LastName', defaultValue: '' }, 'FirstName': { field: 'FirstName', defaultValue: '' }, 'Address1': { field: 'Address1', defaultValue: '' }, 'Zip': { field: 'Zip', defaultValue: '' }, 'WasRead': { field: 'WasRead', defaultValue: 0 }, 'Icon': { field: 'Icon', defaultValue: 'unread' }, }, icon: function() { vari = 'read'; i = this.fields.Icon.toString(); returnkendo.format('km-icon km-{0}-e', i); } } }, serverPaging: false, serverSorting: true, pageSize: function() { returnapp.getSettings().pagesize; }});functioninitList() {// had tried with var myListView //myListView = $("#mylist").kendoMobileListView({ // dataSource: MydataSource //}).data("kendoMobileListView"); $("#remoteListView").kendoMobileListView({ dataSource: MydataSource, dataBinding: function(e) { console.log(e); } });}functionviewShow() { //myListView.refresh(); $("#remoteListView").kendoMobileListView().data().read();}This gives an error when viewing that .read() is not a function. So I think my problem is how I am trying to reference the listview from within the javascript.
Thanks in advance for your help.