[RossL321]

Hi
I have been building a number of screens which require a scrollpanel to cope with the amount of data loaded into lists.

I assumed that the scrollpanel content area height would be the property you needed to manipulate to ensure the user can scroll all the way to the foot of a list, but setting it at runtime doesn’t seem to alter the scrollable area height. It seems the design time setting gets adopted and cannot be altered on the client.

Is there a workaround for this?

thanks
Ross

[Brandon]

I believe after you set it you need to process the DOM again to get it to take, see if this works call it after you change the height:

phoneui.preprocessDOM('name of screen to update UI');

[RossL321]

Thanks CincyPlanet, but that did not work for me.
I placed the code at the end of my documentReady logic, so it should have the new height of the scroller panel already set, but it didn’t work.
This is my code for setting the scroller panel height:
$(‘#m1-Main-panel1.scroller’).css({‘height’: + ht});
Obviously I have calculated the new height based on the height of each list item I have added.
Am I barking up the wrong tree?
regards
Ross

[Brandon]

The first thing I see wrong is the syntax it should be a comma after height not :
And you don’t need the {} in there.

[RossL321]

Thanks for your help CincyPlanet.
I had another syntax error in that simple expression, the ‘.’ instead of ‘-‘ before scroller!
Unfortunately, still not working. Although the div for the scroller now takes the new height value programatically, and the preprocessDOM function is called, it seems that the scrolling still wont go down to show the additional content! As soon as you let the list go, it bounces back to show only those rows within the initial design time height setting.
Any other ideas?

[Yann]

Hello Ross
have you updated your scroller?

myscrollername.refresh();

Yann

[RossL321]

Hi Yann
I am confused by your comment.
I have tried refresh() on the DOM panel-scroller object, but there isn’t one, I tried JQuery, but I didn’t find one there either. Do you mean there is a refresh function in the phoneui?
thanks

[Yann]

Hi,
if i understand, you have a div who’s populated and iscroll ‘height doesn’t refresh?
if i can’t anticipate height of my content loaded by ajax i don’t use iscroll with panel object
try to place an html object with inside

<div id="wrapper">
    <div id="scroller"><ul id="mylist"></ul>
</div>
</div>

and in your js file

var data='<li>test</li>';
var myScroll = new iScroll('wrapper');
$('#mylist').append(data);    // an example but you can add content from ajax.
myScroll .refresh();
}

hope this help you
Yann

[RossL321]

Thank you Yann. All better now. I wan’t aware that iScroll was the object I was using.
Cheers
Ross

[Yann]

Hello Ross
Glad to help you
Yann

[Author]

Posts