problems with jquerymobile page to page

Hi,

I need to know what i have to do to jquerymobile runs a function when it's load.

I have a page in jquerymobile that when i link a <li><a> in page1 then sends me to another page, not using #page2 for example. I am using href="page2.php" for example. All works well, i try many things including document. ready and others, but only works when i press the refresh button. How i can do that when the page2 loads then runs a script when i press the link in page1
<!DOCTYPE html> 
<html>
<head>
<meta charset="UTF-8">

<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0;">
<meta http-equiv="Cache-control" content="no-cache">

<title>WEB</title>
<link href="jquery-mobile/jquery.mobile-1.3.0.min.css" rel="stylesheet" type="text/css"/>
<script src="jquery-mobile/jquery-1.8.3.min.js" type="text/javascript"></script>
<script src="jquery-mobile/jquery.mobile-1.3.0.min.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="css/mobile.css">
<script>

$(document).ready(function(e) {
    
alert ("test")

});
</script>

</head> 
<body>

<div data-role="page" id="cargaActual" data-add-back-btn="true" data-theme="b"> <!--comienzo de pagina-->
<div data-role="header"><h1><?php echo $feeder ?></h1><a href="javascript:location.reload(true)" data-role="button" data-icon="refresh" data-iconpos="notext" class="ui-btn-right"></a>
        <a href="ali.php" data-icon="arrow-l" data-iconpos="notext" class="ui-btn-left"></a></div>
  <div data-role="content"> <!--comienzo de contenido-->
  
  <ul data-role="listview" class="classEventos"> <!--comienzo de lista de eventos-->
  
  <li id="mensaje"></li>
  

</ul> <!--fin de lista de eventos-->
</div> <!--fin de contenido-->
</div> <!--fin de pagina-->
</body>
</html>

Open in new window

LVL 1
joyacv2Asked:
Who is Participating?
 
leakim971Connect With a Mentor PluritechnicianCommented:
paste this with chrome or firefox : view-source:http://fiddle.jshell.net/fgoen7zb/4/show/
0
 
GaryCommented:
0
 
joyacv2Author Commented:
hi Gary,

I try pagecreate but the same problem, any other?
0
The 14th Annual Expert Award Winners

The results are in! Meet the top members of our 2017 Expert Awards. Congratulations to all who qualified!

 
GaryCommented:
Post your code. You may need to do an hard refresh
0
 
joyacv2Author Commented:
what is a hard refresh?
0
 
joyacv2Author Commented:
my code is in my post
0
 
GaryCommented:
The code using pagecreate
0
 
joyacv2Author Commented:
i change pagecreate in the past, can you provide an example?
0
 
GaryCommented:
The example is right there in the link
jQuery(document).on( "pagecreate", function( event ) { 
     // page load events here
})

Open in new window

0
 
leakim971PluritechnicianCommented:
use pagechange : http://api.jquerymobile.com/pagechange/

$( document ).on( "pagechange", function( event ) {
  alert ("test");
});

Open in new window

0
 
joyacv2Author Commented:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">

<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0;">
<meta http-equiv="Cache-control" content="no-cache">

<title>WEB</title>
<link href="jquery-mobile/jquery.mobile-1.3.0.min.css" rel="stylesheet" type="text/css"/>
<script src="jquery-mobile/jquery-1.8.3.min.js" type="text/javascript"></script>
<script src="jquery-mobile/jquery.mobile-1.3.0.min.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="css/mobile.css">
<script>
jQuery(document).on( "pagecreate", function( event ) {
     alert("yes");
})
$(document).ready(function(e) {
   
alert ("test")

});
</script>

</head>
<body>

<div data-role="page" id="cargaActual" data-add-back-btn="true" data-theme="b"> <!--comienzo de pagina-->
<div data-role="header"><h1><?php echo $feeder ?></h1><a href="javascript:location.reload(true)" data-role="button" data-icon="refresh" data-iconpos="notext" class="ui-btn-right"></a>
        <a href="ali.php" data-icon="arrow-l" data-iconpos="notext" class="ui-btn-left"></a></div>
  <div data-role="content"> <!--comienzo de contenido-->
 
  <ul data-role="listview" class="classEventos"> <!--comienzo de lista de eventos-->
 
  <li id="mensaje"></li>
 

</ul> <!--fin de lista de eventos-->
</div> <!--fin de contenido-->
</div> <!--fin de pagina-->
</body>
</html>

don't work, also don't work with pagechange
0
 
joyacv2Author Commented:
when the page comes from the other page, the code doesn't execute, then i press refresh and works!
0
 
leakim971PluritechnicianCommented:
check this page : http://jsfiddle.net/fgoen7zb/4/
look like it work
0
 
joyacv2Author Commented:
hi leakim,

This works, but it comes from another page. My code works if i refresh the page after load, but initially nothing happens. Do you test with a link from other page?
0
 
leakim971PluritechnicianCommented:
I think when you click on the link from Experts-Exchange to go to jsfiddle it's what happen :)
0
 
joyacv2Author Commented:
so,

what do you think is the problem? because in my code doesn't work. My other page contains this link

echo '<li><a href="cargaActual.php?feeder='.$paraloop['Feeder'].'">'.$paraloop['Feeder'].'</li>';
0
 
leakim971PluritechnicianCommented:
I don't think it's relevant of your link
You've so many scenario, it would be better to see your page
Maybe a javascript error which break the code
0
 
joyacv2Author Commented:
which page do you need to see?, the one that i submit is my complete page, the page with the link is a page with some links
0
 
leakim971PluritechnicianCommented:
what the jQuery versions ?
Here the one used on the jsfiddle :
  <script type='text/javascript' src='//code.jquery.com/jquery-1.9.1.js'></script>
  <script type="text/javascript" src="http://code.jquery.com/mobile/1.3.0-beta.1/jquery.mobile-1.3.0-beta.1.js"></script>
  <link rel="stylesheet" type="text/css" href="http://code.jquery.com/mobile/1.3.0-beta.1/jquery.mobile-1.3.0-beta.1.css">

Open in new window

0
 
joyacv2Author Commented:
works, what is that? i cannot see the code
0
 
leakim971PluritechnicianCommented:
this is the code of the jsfiddle
0
 
joyacv2Author Commented:
do you see something abnormal in my code?
0
 
leakim971PluritechnicianCommented:
did you tried the 1.9 instead 1.8 jQuery version?
0
 
joyacv2Author Commented:
let me try
0
 
joyacv2Author Commented:
same problem with 1.9
0
 
leakim971PluritechnicianCommented:
ok, could you provide a link to your page or build one with the same issue ?
0
 
joyacv2Author Commented:
i test your code and there will be an error in some part of my code, i decided to make it simple including in the same page and works with a little problem that i am going to create in a new problem, i will credit the points to this answer and open a new one, thanks!
0
All Courses

From novice to tech pro — start learning today.