JQTouch: passing data between 'views'

Hi I have been playing around with jqtouch today and I'm just wondering how to manage data.

I tried looking around but couldn't see much documentation.开发者_如何学C

If I had a list of links for say products? And I click on one i can navigate to the product 'view'. How to I pass variables like you would a $_GET variable to select THAT product?

Or even if I set the id of the link to the id of the record and use JS to grab the ID and somehow pass it to the next view?

Any help with this would be most appreciated!

NOTE: I also want to use it with the offline extension so I'm not sure get ajax would work

Regards,

Billy

You can use the referrer property for the data object. The link would look like:

<a href="#view" id="1">Product #1</a>

where the HTML ID would correspond to the product ID. Then in the "pageAnimationEnd" event you can retrieve the product details like this:

$('#view').bind('pageAnimationEnd', function (e, info) {
  // get the id of the calling href
  var id = $(this).data('referrer')[0].id;

  $.getJSON('/products/' + id, function (data) {
    // do something with the data
  });
});

You could look at the demo to see how it does form submission, i.e. AJAX > POST Form Example. Essentially, you create a form and a jQT-style submit button:

<form id="ajax_demo" action="ajax_demo.php" method="POST" class="form">
  ...
  <a class="submit whiteButton" href="#">Submit</a>
</form>

Then in your receiving page (i.e. ajax_demo.php), you can access the form fields, e.g. PHP's $_GET or JavaScript's location.search.

Another way is to store the data in the DOM with jQuery:

// in global level
$('body').data('ajax_demo', "some data for the page");

// in page/view level
$('#ajax_demo').data('key', 'value');