Question

While I’m a bit of a dab hand in php, I’m stumbling my way through a JQuery Mobile project via Phonegap for an iOS app. So getting my head around javascript (quickly) has been challenging. Managed to solve most problems mostly with the help of the good folk here, so thought I’d ask this one which I can’t find a solution for.

I have a list which is generated from an ajax request (summary with a heading and short description), with the full detail being stored in an SQLite DB for offline use. I’m wanting to open a dialog with the full detail on click. JQM’s data-rel dialog is a breeze for static pages, but I can’t figure a means to send the dialog page an index parameter to pull the data from the DB. Once I get the parameter down to the “page” I’m pretty confident pulling the data and replacing the DOM elements, so the short question is how do I send the index parameter from the list to the dialog page?

Thanks heaps in advance!

Answer 1

You can, in your list (I am assuming data-role="listview" here), build the links that represent clickable elements:

<ul data-role="listview">
    <li>
        <a href="dialog.html?id=someId" data-rel="dialog">Show details</a>
    </li>
</ul>

where you insert someId dynamically when you create your list.

In dialog page you parse your URL and get the ID.

Update

The following confirmed as working in Safari (on my desktop):

<a href="dialog.html?id=someId" data-rel="dialog">Show details</a>

and the usage would be:

$.mobile.path.parseUrl($(this).data('url')).search

which would contain the following string:

?id=someId