How to programmatically change a jquerymobile page and send data to this page?

guys!
I am using jquerymobile 1.3.0 and jquery 1.9.1
I have 2 (more) jquerymobile pages.
For instance:

<div data-role="page" id="firstPage"> <!-- Header --> <div data-role="header"> <h3>First page</h3> </div> <!-- Body --> <div data-role="content"> some content ... </div> </div> <div data-role="page" id="secondPage"> <!-- Header --> <div data-role="header"> <h3>Second page</h3> </div> <!-- Body --> <div data-role="content"> some content ... </div> </div> 

I need to go from the first page to the second page and send some parameters, usually a URL
I tried using this method:

 $.mobile.changePage('#secondPage', { data: {id: 123, module: 111} } ); 

After this method, the elements on the first page are hidden, and the URL changes to www.mydomain.com/main.html?id=123&module=111 but the page does not change. I think to change the page to a URL to a hash of this page.
and the URL should be

 www.mydomain.com/main.html?id=123&module=111#secondPage 

then i tried using:

 location.href += '?id=1234&module=111#secondPage'; 

This method is work))) But when I tried to return to firstPage, the page changed, but the data remained in the URL

 www.mydomain.com/main.html?id=123&module=111 

Then I tried to delete this data using the following method

 location.href = location.href.replace(location.origin, "").replace(location.pathname, ""); 

But after this method, my firstPage loops around to change.
Please help the guys. How to send data to secondPage and delete this data when I return to firstPage?
My back button used the jquerymobile native method to return.

 <a data-theme="a" data-role="button" data-transition="fade" href="#firstPage" data-iconpos="notext" class="ui-btn-left backButton"></a> 

P / S. I apologize for my English, my English level is elementary

+4
source share
1 answer

If you define two pages in one html, you do not need to send arguments to another page with a url. Just use javascript variables and page events to use them.

If you use URLs to run server-side code, just use different .html files. One html file, one page style.

But for the smooth transition effects to mobile devices and the best user experiment, I prefer to use AJAX and create / modify pages live,

Best wishes

+1
source

Source: https://habr.com/ru/post/1469414/


All Articles