Form Result In Same Page
Solution 1:
Make two changes
- remove action attribute value, i.e. change
action="test.php"toaction=""or you can remove it, its not needed. - change
return false;toreturn true;in js,$('#f1').submit(function()
(explanation of when to use return true/false, currently you requested an submit action, which was called from a jquery function, if from a javascript/jquery you are returning false it means that the current request i.e. submit will not occur. in case of true, the submit will occur. we use false if cases when we are validating something and the user has not added correct output so we don't want to submit the page until he corrects the data. also action is not required in this case as you are submitting via jquery so you can remove the action="" attribute from the form)
also you already have html tags in test.php, including it inside test2.php will create issues.
suggestion call test.php directly, you don't need test2.php.
Here's the full code for test.php,
<?php
if (isset($_POST['submit'])) {
$arr=array();
foreach ($_POST as $key => $value) {
$arr[$key]=$value;
}
print_r($arr);
}
?>
<!DOCTYPE html>
<html>
<head>
<title> Form </title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<link rel="stylesheet" href="css/main.css" />
</head>
<body>
<div id="content" id="login_form">
<form method="post" id="f1" name="f1" action="">
<table>
<tr>
<td>Name :</td><td><input type="text" name="name"/></td>
</tr>
<tr>
<td>Register Number :</td><td><input type="text" name="regno"/></td>
</tr>
<tr>
<td>Date of Birth :</td><td><input type="text" name="dob"/></td>
</tr>
<tr>
<td><input type="submit" id="b1" name="submit" value="Submit" style="font-size:16px;"/></td>
</tr>
</table>
</form>
</div>
<script>
$('#f1').submit(function() {
$.ajax({
data: $(this).serialize(),
type: $(this).attr('post'),
url: $(this).attr('test.php'),
success: function(response) {
$('#content').html(response);
}
});
return true;
});
</script>
</body>
</html>
Solution 2:
May be you find your solution..............
<?php
if(isset($_POST['submit'])){
$arr=array();
foreach( $_POST as $key => $value ){
$arr[$key]=$value;
}
print_r($arr);
}
?>
<!DOCTYPE html>
<html>
<head>
<title> Form </title>
<link rel="stylesheet" href="css/main.css" />
</head>
<body>
<div id="content" id="login_form">
<form method="post" id="f1" name="f1" action="test.php">
<table>
<tr>
<td>Name :</td><td><input type="text" name="name"/></td>
</tr>
<tr>
<td>Register Number :</td><td><input type="text" name="regno"/></td>
</tr>
<tr>
<td>Date of Birth :</td><td><input type="text" name="dob"/></td>
</tr>
<tr>
<td><input type="submit" id="b1" name="submit" value="Submit" style="font-size:16px;"/></td>
</tr>
</table>
</form>
</div>
</body>
</html>
Solution 3:
This must fix your issue. replace the line
<form method="post" id="f1" name="f1" action="test.php">
with
<form method="post" name="f1" action="">
you cannot use "id" in "form"
Post a Comment for "Form Result In Same Page"