- This topic has 7 replies, 4 voices, and was last updated 11 years, 3 months ago by
.
-
Posts
-
Hello,
I’m developing an app with MobiOne that have 3 screens:
– a form with some parameters
– a list of results
– a detail page of a specific itemThe second screen build a custom list with data received from a remote page (called by ajax/jsonp).
I implement this custom list following this example:
http://www.genuitec.com/support-genuitec/viewtopic.php?f=14&t=1858&hilit=phoneui.preprocessDOM
This works fine!Now because the custom list can contain thousands of items, when form is submitted I display only a number of items (for example 20) at time, then I display a new last item (the 21th) called “Show other results”. The “onclick event” of this item call a javascript that display other 20 items and so on… It works and the result are display 20 by 20, but I have a problem with the scrollbar of my list. After I display 20 items I use this code to modify my scrollbar:
//Update panel's content height, set the ht value on the panel's //scroller <div> data-layout-content-height attribute. var panelHt = 30 + 60 + (totalElementsDispayed * 110); $('#m1-nuovousato-risultato-panel1-scroller').attr('data-layout-content-height', panelHt);This works at first time (when I display the first 20 records) but it doesn’t work the other times (for example when I display the “second” 20 records, from 21 to 40). The items are added properly to the list but it cannot be scrolled (even if panelHt value is right), scrollbar works only for the first 20 records. Then if I click on an item, I enter the detail page and then if I use the “back button”, I return to my list with the scrollbar that now works properly for all items (I can see the items from 1 to 40). Why this behaviour? Please, can you help me?
Another question: I see in other posts that MobiOne team was working on image gallery in the last months. Have you an example of it?
Thanks in advanced
Note the data flow, when you click on Create list button, you got a transition, so next functions are involved:
phoneui.prePageTransition = function(currentPageId,targetPageId) {
if (currentPageId == ‘#m1-home’ && targetPageId == ‘#m1-list’) {
[1] buildList();
} else if (targetPageId == ‘#m1-landing’) {
updateLandingScreen();
}
return true;
}buildList function is called before transition and data is populate in second screen, when second screen is loaded the phoneui.preprocessDOM function is called
phoneui.postPageTransition = function(newPageId) {
if (newPageId == ‘#m1-list’) {
//rebind all list-items to be selectable
[2] phoneui.preprocessDOM(‘#m1-list’);
}
}So if you’re updating the list in same screen you should call the phoneui.preprocessDOM after call the buildList function:
buildList();
phoneui.preprocessDOM(‘#m1-list’);Hope this information is helpful for you.
Thanks for your answer but I’m still using phoneui.preprocessDOM function on my page id after resizing the scroll panel.
I modify your project custom-list, now called custom-list-20by20 so you can see my problem.
See attachment custom-list-20by20.zip
These are main changing to your project:
1) I add the item “Show next items” to list.mobi and associate js function showNext on onclick event
2) I introduce global variable pageNo (default 0) to home_custom.js. I use this variable to count each block of items is loaded
3) I modify buildList function for display results
4) I add my showNext function to js
If I run this project I can generate first 20 items properly (from 1 to 20) and I can scroll them. Then if I click “Show next items” other 20 items are added to my list (from 21 to 40) but they are not scrollable. If I enter landing page and I return to the list, I can scroll all the items properly. What is my error?
Thanks for your support
We have not forgotten. This issue is in our queue.
@wayne
First of all, I hope that you have an happy new year.
Have you got some news about my request? I know that it’s in your queue but my app is blocked since a month and I’m waiting for your feedback. Please can you give me an answer or a date for the answer?
Thanks in advancedOur dev team have looked at your request and shared next modification to your project. Hope it is helpful.
