How to pass button text to another page?

Question

I'm making an app for the BlackBerry PlayBook using jQuery Mobile, and in a page (actually a div with data-role='page'), I've got a lot of (say, 125) buttons each with a unique text. I've used the a tag with data-role='page' for this.

There's a separate page like the above, but with different content in the same HTML file. The content in this page depends on the button clicked in the page 1.

So my question is, how can I load the page 2, along with the associated content, according to the button clicked in page 1? I need to pass the text in the middle of <a> and </a> tags to the page 2 and load the content accordingly.

Any help greatly appreciated.

Answer 1

well you might be having a unique value associated with your each button then on click fire same function on each button, in that function check the value ans as according direct to the page. or else you can use html5's localStorage/sessionStorage for storing values passing between pages. for more details visit here

Answer 2

You can use the url itself to pass the data using the query string for example and then in the pageshow event of the page being called you check that and display the appropiate content.

Button markup

<a href="#page2?btn=Hello">Button 1</a>

Bind to pageShow some time before it will get called (it shouldnt't actually need to be in the document ready since it's being delegated, but assuming that's where you start your app you can place it there).

$(function() {
     $(document).delegate('#page2', 'pageshow', function (event, ui) {
                var qryStringResult = getParameterByName('btn'); //hello                     
        });  
});

Function from Artem Barger - https://stackoverflow.com/a/901144/384985

 function getParameterByName(name) 
{
  name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
  var regexS = "[\\?&]" + name + "=([^&#]*)";
  var regex = new RegExp(regexS);
  var results = regex.exec(window.location.search);
  if(results == null)
    return "";
  else
    return decodeURIComponent(results[1].replace(/\+/g, " "));
}

Answer 3

You can use global variable for this.

<a href="#" onclikc="some_function('Button 1')">Button 1</a>

function some_function(data){



global_varible = data;

}

In page2

$( document ).delegate("#page2", "pagecreate", function() { 
       var page2_varible = global_varible;
}