Test scenario:
- Type "hello" in the textbox, you should see "hello" written in the page
- Now click the "test" link (it's just a link to itself with a query string
&test=1
) - Now type "world" in the textbox, you can see that it doesn't get written in the page anymore.
Why is this happening?
You can test this page on a .php
page:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" />
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
</head>
<body>
<form id="search_form" method="post">
<label for="search">Search:</label>
<input type="search" id="search" />
</form>
<script type="text/javascript">
$('#search_form').submit(function (event) {
window.location.href = '<?=$_SERVER['PHP_SELF'].'?s='?>' + $('#search').val();
event.preventDefault();
});
</script>
<br /><br />
<?php $s = filter_input(INPUT_GET, 's'); ?>
Query string: <?=$s?>
<br /><br />
<a href="<?=$_SERVER['PHP_SELF']?>?s=<?=$s?>&test=1">test</a>
</body>
</html>
Demo URL: (removed after problem solved)