When I click submit I'd like all form data to be POSTed to process.php. Then on process.php I want to echo out the POST data and finally replace everything in results div to what was done in process.php.
<script type="text/javascript">
$(document).ready(function(){
$("#myform").submit( function () {
$.ajax({
type: "POST",
dataType: "html",
cache: false,
url: "process.php",
success: function(data){
$("#results").html(data);
}
});
return false;
});
//$("#myform").submit( function () {
//$('#results').html("yay");
//}
// });
//} );
});
</script>
<form name="myform" id="myform" action="" method="POST">
<!-- The Name form field -->
<label for="name" id="name_label">zoom</label>
<input type="text" name="zoom" id="zoom" size="30" value=""/>
<br>
</select>
<!-- The Submit button -->
<input type="submit" name="submit" value="Submit">
</form>
<!-- FORM END ---------------------------------------- -->
<!-- RESULTS START ---------------------------------------- -->
<div id="results">nooooooo<?PHP $_SESSION[''] ?><div>
<!-- <input type="image" name="mapcoords" border="0" src="mapgen.php"> ---- -->
<!-- RESULTS END ---------------------------------------- -->
You can call $.post
passing form data serialized. like this:
<script type="text/javascript">
$(document).ready(function(){
$("#myform").submit( function () {
$.post(
'process.php',
$(this).serialize(),
function(data){
$("#results").html(data)
}
);
return false;
});
});
</script>
$("#myform").submit( function () {
$.ajax({
type: "POST",
data : $(this).serialize(),
url: "process.php",
success: function(data){
$("#results").html(data);
}
});
return false;
});
Test it
There is but another way to do it all. This example uses the jQuery validate plugin. Here, all the form fields are validated automatically. Download jquery from here :
https://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js
Download validation plugin from here :
http://jquery.bassistance.de/validate/jquery-validation-1.10.0.zip
<script type="text/javascript" src="jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="jquery.validate.1.7.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#customForm").validate({
debug: false,
rules: {
name: {required:true,minlength:8,maxlength:8},
email: {required:true,email:true},
},
submitHandler: function(form) {
// do other stuff for a valid form
$('#rsltx').html('<img src="WhiteLoading.gif"> Processing... please wait');
$.post('post.php', $("#customForm").serialize(), function(data) {
$('#rsltx').html(data);
});
}
});
});
</script>
<form method="post" id="customForm" action="">
<div>
<label for="name">Name</label>
<input id="name" name="name" type="text" autocomplete="off" required/>
</div>
<div>
<label for="email">E-mail</label>
<input id="email" name="email" type="email" autocomplete="off" required/>
</div>
<div>
<input id="send" name="send" type="submit" value="Send" />
</div>
</form>
var form = $('#mob_ticket_form')[0]; var data = new FormData(form); $.ajax({ type: "POST", enctype: 'multipart/form-data', url: '{{route("submit_ticket")}}', data: data, processData: false, contentType: false, cache: false, timeout: 800000, success: function(response) { if (response.status == 200) { $("#exampleModalCenter").modal('show'); } else { alert(response.message); } }, error: function(response) { // console.log(response) notify('Something went Wrong!', 'danger') } });
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.