Pass value of a dropdown to a textbox in a different page - PHP/jQuery/AJAX
Question
I want to pass the value of a dropdown in index.php to a textbox in test.php via Ajax.
Test.php is iframed in index.php . Once i change the dropdown, value of that dropdown needs to be updated in the test.php without reloading the page.
Thanks!!
Index.php
<script type="text/javascript">
$(document).ready(function() {
$('#dropdown1').change(function() {
var value = $('#dropdown1').val()
window.location = 'index.php?value=' + value;
})
})
</script>
<body>
<h1>Ajax</h1>
<select id="dropdown1">
<option value="1">Value 1</option>
<option value="2">Value 2</option>
<option value="3">Value 3</option>
<option value="4">Value 4</option>
</select>
<div>
<iframe src="test.php" frameborder="0"></iframe>
</div>
</body>
Test.php
<body>
<?php
echo "<h1> The Current Value: " . $_GET["value"] . "</h1>";
?>
</body>
2 answers
solution1
0 2013-10-04 07:15:27
If by "without reloading the page" you mean reloading index.php you can just post to test.php using target like so:
<iframe id="test_php"/>
<form target="test_php">
<select onchange="this.parentNode.submit()"/>
</form>
This would require your test.php script to accept the post and "reload".
solution2
0 2013-10-04 08:37:43
my previous answer is probably the way to go - simple is better than complex.
if you insist on using ajax (to store changed values on your server), you could use a two-step approach:
1 update iframe without reloading using:
document.getElementById('iFrameID').contentWindow.document.body.innerHTML='Hello changed value!'
2 use ajax to update value on server, no callback needed.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.