开发者

jQuery Mobile how to refresh a page with list

I'm developing a simple website using Java Struts2 and jQuery Mobile, where I have an options page which has a link to a page with a nested list.

The navigation is as simple as clicking the list option (on the options page) and move to the that page with the list.

I'm able to draw the nested list exactly how I want it dynamically on the JSP, however the list content will keep static even if something changes on the database.

The problem here is that I want to be able to refresh the list content when:

  1. at least when I enter that list page from the options OR
  2. when returning from the nested list screen to the main list screen OR
  3. by using an explicit button on the list screen to refresh the content - or eventually a timer

How can I achieve this b开发者_C百科ehavior? I don't know how/where to apply or invoke this piece of code from the jQuery Mobile documentation:

$('ul').listview('refresh')

I appreciate any kind of help. Thanks.


The selector should be a selector that applies to the list you want to create (the 'ul' is generic) - so if your list is id = 'bliss' the selector and function would be $('#bliss').listview('refresh'), and you activate that based on context, i.e. on pageshow, click, etc.

For example, on pageshow I think it would be something like this:

$('#optionScreen').live('pageshow',function(event, ui){
    $('#optionList').listview('refresh')
});

You want to make sure that method fires so the bind happens before the page is actually shown (the snippet above is adding the refresh to the pageshow event of the #optionScreen page)

Here's the page div that would hold the list:

<div data-role="page" data-url="optionScreen" id="optionScreen">
    <ul id="optionList" data-role="listview">
        <li>generated stuff</li>
    </ul>
</div>

edit 2- you may want to look at this plug-in for what you're working on, it might even be a solution to what you're doing: https://github.com/hiroprotagonist/jquery.mobile.actionsheet (it's a modal dialog for setting options, etc.)

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜