I'm working on a search engine and I have a really serious problem with GET
and POST
methods.
Im using an <input type="button" />
to avoid page from refreshing every time im pressing the button.
After button is pressed I'm showing a result (google_map, monumet picture, specs).
The problem now is that I want to submit and show form values + result (google_map, monumet picture, specs) by pressing this button.
This is a problem because <input type="button" />
does not submit form values and I'm really stuck.
Sure, here is a working example for you:
index.php
<!DOCTYPE html>
<html>
<head>
<title>Working Example</title>
</head>
<body>
<form id="search-form">
<input type="text" name="text1" id="text1" value=""><br>
<input type="text" name="text2" id="text2" value=""><br>
<input type="text" name="text3" id="text3" value=""><br>
<input type="button" id="search-button" name="search-button" value="search">
</form>
<div id="response"></div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$('#search-button').click(function(){
$.ajax( {
type: "GET",
url: 'response.php',
data: $('#search-form').serialize(),
success: function(response) {
$('#response').html(response);
}
} );
});
});
</script>
</body>
</html>
response.php
<?php
echo "text1: " . $_GET['text1'] . "<br>";
echo "text2: " . $_GET['text2'] . "<br>";
echo "text3: " . $_GET['text3'] . "<br>";
echo "your response ...";
In the response you return whatever your response is, plus the form fields.
onClick="document.getElementById('FormName').submit();"
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.