I have a php-script controlling some JQM-pages. The JQM pages are activated using php require. It works fine for all single-page JQM pages and almost for the multi-page JQM page. The only problem is that the link (anchor) button on the multi-page seems to be dead (href="#page2" for example).
The dead link button works if I reload the multi-page or if I start the multi-page by hand in the browser.
Do you have a solution to this problem (except adding a reload or turning the multi-page into single pages)?
This does not work (all files on server):
index.php:
<?php
session_start();
$action = isset( $_GET['action'] ) ? $_GET['action'] : "";
if ( !$action ) $action = isset( $_POST['action'] ) ? $_POST['action'] : "";
if ($action == 'multi')
require('multi.php');
else
require('single.php');
?>
single.php:
<?php ?>
<!doctype html>
<html>
<head>
<title>SINGLE</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" />
<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
<meta name="apple-mobile-web-app-capable" content="yes">
<link rel="apple-touch-icon" href="images/app-icon.png">
</head>
<body>
<div data-role="page" id="single">
<div data-role="header" data-theme="a">
<h2>SINGLE 1(1)</h2>
</div>
<div data-role="content">
<p>This is page single.</p>
<form action="index.php" method="post" >
<fieldset data-role="controlgroup">
<input type="submit" name="action" id="multi" value="multi">
</fieldset>
</form>
</div>
</div>
</body>
</html>
multi.php:
<?php ?>
<!doctype html>
<html>
<head>
<title>MULTI</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" />
<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
<meta name="apple-mobile-web-app-capable" content="yes">
<link rel="apple-touch-icon" href="images/app-icon.png">
</head>
<body>
<div data-role="page" id="page1">
<div data-role="header" data-theme="a">
<h2>MULTI 1(2)</h2>
</div>
<div data-role="content">
<p>This is page 1.</p>
</div>
<div data-role="footer" data-position="fixed" data-theme="a" data-id="nav">
<div data-role="navbar">
<ul>
<li><a class="ui-btn" data-transition="slide" data-icon="arrow-r" data-iconpos= "top" href="#page2">Next</a></li>
</ul>
</div>
</div>
</div>
<div data-role="page" id="page2">
<div data-role="header" data-theme="a">
<h2>MULTI 2(2)</h2>
</div>
<div data-role="content">
<p>This is page 2.</p>
</div>
</div>
</body>
</html>
Start index.php in the browser, tap multi button, and now the next button is not working...
