Value Passing In Jquery from one html class to other html class in PhoneGap

Question

I am a Iphone developer now moving to phonegap for making cross plateform application.

I have stared learning jqueryMobile for uiDesgin.It is good.

Issue is her

Answer 1

Solution 1:

You can pass values with changePage function:

$.mobile.changePage('page2.html', { dataUrl : "page2.html?paremeter=123", data : { 'paremeter' : '123' }, reloadPage : true, changeHash : true });

or with a button like this:

Or through a basic link

And read them like this:

$(document).on('pagebeforeshow', "#index", function (event, data) {
    var parameters = $(this).data("url").split("?")[1];;
    parameter = parameters.replace("parameter=","");  
    alert(parameter);
});

index.html

  
    
    
    
    
    
    
    
    
      
    
   
   
    
    

        

            

                First Page
            
        
        

                        Pass parameters with changePage function
                        Or through a basic link
        
 
    


  

second.html

  
    
    
    
    
    
    
    
    
      
   
   
    
    

        

            

                Second Page
            
        
        


        
 
    


  

This solution is used for multi-HTML template where one jQuery Mobile page is also one HTML file.

Solution 2:

Or you can create a persistent javascript object for a storage purpose. As long ajax is used for page loading (and page is not reloaded in any way) that object will stay active.

var storeObject = {
    firstname : '',
    lastname : ''
}

Example: http://jsfiddle.net/Gajotres/9KKbx/

Solution 3:

You can also access data from the previous page like this:

$('#index').live('pagebeforeshow', function (e, data) {
    alert(data.prevPage.attr('id'));
});   

prevPage object holds a complete previous page.

Solution 4:

As a last solution we have a nifty HTML implementation of localStorage. It only works with HTML5 browsers (including Android and iOS browsers) but all stored data is persistent through page refresh.

if(typeof(Storage)!=="undefined") {
    localStorage.firstname="Dragan";
    localStorage.lastname="Gaic";            
}

Example: http://jsfiddle.net/Gajotres/J9NTr/

More info

If you want to find more information about this topic take a look at this article. You will find everything explained in more details plus working examples.