First steps on NS with JS - Help with ViewModel?


#1

Hello everyone, I’m quite new to NS and I’ve been working on an application to learn, but I’m facing some doubts about the view-model structure and maybe someone can help me. I’ll try to explain what I’m trying to do first, should be easy:

What I Want:
1 - Load a JSON to a RadListView using HTTP.getJSON.
2 - Enable Pull to Refresh.
3 - In the future use Group Function.

I was able to do step 1 simply using a main-page.js that is creating the view model object on the navto function as shown here (not full code of course):

function onNavigatingTo(args) {
    const page = args.object;
    const mainViewModel = AgendaViewModel();
    page.bindingContext = mainViewModel;
}

Now, in the AgendaViewModel, I create an ObservableArray and fill the information from the JSON to the UI:

function AgendaViewModel() {
    const agendaVM = new observableModule();
    var agendaList = new observableArray.ObservableArray([]);
    .... here it gets the JSON an do the .set to show it on the UI ...
}

This ALL works fine, the code in not complete here because of space (can upload later to some repo), but my question and concern is:

To implement the PULL TO REFRESH, should I use a {{ refresh }} observable on the XML and create a function to do it inside the View-Model ? Because doing it that way, I cannot stop the refreshing (tried with FindByView, Etc…) and I’m not sure if it’s ok to do it there in the VM anyway …
OR
Should I do the pulltorefresh code inside the main-page ? removing the brackets and creating the function inside the main-page that re-launches the main view-model function to recreate/refresh the data… ?

ALSO, the same applies to the Grouping, where is supposed to be done ? Main-Page or View-Model ?

Sorry it’s long, kinda of lost here understanding the right way to do it.


#2

You can place the refresh code in either Observable (ViewModel) or Code behind file (Controller), that’s up to your connivence and both work.