<!DOCTYPE html>
<html>
<head>
<title>AJAX</title>
<script type="text/javascript" src="jquery-3.2.1.js"></script>
</head>
<body>
<div id="content">
<div id="wrapper">
<div id="steps">
<form>
<fieldset class="step">
<legend>Registration & Login Page</legend>
<p>
<label for="username">username</label>
<input id="username" name = "username" placeholder="Enter your username" />
</p>
<p>
<label for="email" >email</label>
<input id="email" name ="email" placeholder="Enter your valid email" type="email"/>
</p>
<p>
<label for="password" >psw</label>
<input id="password" type="password" name="psw" placeholder="password" />
</p>
<p>
<label for="address">address</label>
<input id="address" type="text" name = "address" placeholder="Enter your address" />
</p>
<p>
<label for="phone">phone</label>
<input id="phone" name = "phone" placeholder="e.g. +351215555555" type="tel" />
<p>
<label for="country" >country</label>
<select id="country" name="country">
<option>select</option>
<option>india</option>
<option>usa</option>
<option>japan</option>
<option>pakistan</option>
<option>germany</option>
<option>Russia</option>
</select>
</p>
</p>
<p>
<a id="register" name="register" style="cursor: pointer; color: red;text-decoration: underline;">Register</a>
</p>
<p></p>
</fieldset>
</form>
</div>
</div>
</div>
--------------------------------------------------------------------------------------------------------------
Copy Ajax/jquery script and paste before closing </body> Tag in Test.html file
<script type="text/javascript">
$(document).ready(function(){
$('#register').click(function(){
var username = $('#username').val();
var email = $('#email').val();
var password = $('#password').val();
var phone = $('#phone').val();
var address = $('#address').val();
var country = $('#country').val();
$.ajax({
type:'POST',
url: 'index.php',
//data: 'username='+username+'&email='+email+'&password='+password;
data: {"username":username,"email":email ,"password ":password ,"address":address,"phone":phone,"country":country},
success:function(result)
{
alert(result);
//var final = eval('+'+result+'+');.
$('#').hide();
$('#').slide();
}
});
return true;
}); // ajax function ends here
});
</script>undefined</body>undefined</html>
.........................................................................................................................................................
Copy Script and Paste to undefined<head> Tag of Test.html file
undefined<script type="text/javascript" src="jquery-3.2.1.js"></script>
<?php
echo '<pre>';
print_r($_POST);
echo '</pre>';
die;
$username = $_POST['username'];
$email = $_POST['email'];
$psw = password_hash($_POST['psw'], PASSWORD_DEFAULT);
$country = $_POST['country'];
$address = $_POST['address'];
$phone = $_POST['phone'];
$imageupload = $_POST['imageupload'];
$con = mysqli_connect('localhost', 'root', '');
mysqli_select_db($con, 'app');
$q = "INSERT INTO databasee (username, email,psw,country,address,phone,imageupload) VALUES ('$username','$email','$psw','$country','$address','$phone','$imageupload')";
mysqli_query($con,$q);
echo "hello $username thank you for submitting the form";
?>
Copy Ajax/jquery script and paste before closing </body> Tag in Test.html file
<script type="text/javascript">
$(document).ready(function(){
$('#register').click(function(){
var username = $('#username').val();
var email = $('#email').val();
var password = $('#password').val();
var phone = $('#phone').val();
var address = $('#address').val();
var country = $('#country').val();
$.ajax({
type:'POST',
url: 'index.php',
//data: 'username='+username+'&email='+email+'&password='+password;
data: {"username":username,"email":email ,"password ":password ,"address":address,"phone":phone,"country":country},
success:function(result)
{
alert(result);
//var final = eval('+'+result+'+');.
$('#').hide();
$('#').slide();
}
});
return true;
}); // ajax function ends here
});
</script>undefined</body>undefined</html>
.........................................................................................................................................................
Copy Script and Paste to undefined<head> Tag of Test.html file
undefined<script type="text/javascript" src="jquery-3.2.1.js"></script>
.....................................................................................................................................................
Create index.php file
<?php
echo '<pre>';
print_r($_POST);
echo '</pre>';
die;
$username = $_POST['username'];
$email = $_POST['email'];
$psw = password_hash($_POST['psw'], PASSWORD_DEFAULT);
$country = $_POST['country'];
$address = $_POST['address'];
$phone = $_POST['phone'];
$imageupload = $_POST['imageupload'];
$con = mysqli_connect('localhost', 'root', '');
mysqli_select_db($con, 'app');
$q = "INSERT INTO databasee (username, email,psw,country,address,phone,imageupload) VALUES ('$username','$email','$psw','$country','$address','$phone','$imageupload')";
mysqli_query($con,$q);
echo "hello $username thank you for submitting the form";
?>
0 comments:
Post a comment