Email_id: softwarequery786@gmail.com

SoftwareQuery
Home About Contact

How To Use Ajax/Jquery Request Submit Forms On The Same Page

 SoftwareQuery     No comments   

 Create Html File Test.html 
<!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>


.....................................................................................................................................................

                      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";
                  ?>

                   















                       

                         
  • Share This:  
  •  Facebook
  •  Twitter
  •  Google+
  •  Stumble
  •  Digg
Email ThisBlogThis!Share to TwitterShare to Facebook
Newer Post Older Post Home

0 comments:

Post a Comment

Donate

Translate

Popular Posts

  • How to Make Image Upload Code Using AJAX
    Direct Copy Paste PHP File  Image Upload Code -   <html> <head> <meta charset="utf-8"> <meta http-equi...
  • Free Live Streaming Cricket Matches
    FREE LIVE STREAMING CRICKET MATCHES  -:                                                       Watch On Server-1                ...
  • How To Install Magento on Localhost XAMPP OR WAMP SERVER
      Step-1 => Make Sure you have to install Latest Version of  Xampp server or Wamp server in your PC.   Step -2 => Go to Web Bro...
  • Best Useful Free Plugin to Make Wordpress Theme
    Meta Slider   - Meta Slider is that the initial free possibility on today’s list. A premium version is additionally obtainable...
  • How To Intall Node.js Via Command On Window And Linux.
    Step-1 . Firstly We have to go official website of https://nodejs.org/en/ then download the latest version of Nodejs zi...
  • How To Create Custom Pagination In WordPress
    Hello, Friend's in this post we are creating a custom code of Pagination in WordPress. It is very easy to put this code any custom...
  • How To Install Wordpress in Xampp Server And Wamp Server
      Step 1st  -      Install WampServer or Xampp Server.                                                                               ...
  • How to Set up Amazon Affiliate Marketing Account to Earn Money
    Amazon Associates is a  marketing of Amazon company. It is allowed to youtube channel owner, Social Media pages owner and any type...
  • How To Scrape Data From Website Url Using Php.
    Q. why using a Scraping. If we want to get data of another website then using web scraping. It is using a PHP HTML Dom parser library ...
  • How to create Database Connection with ENCRYPT Password in Php
    <?php  $username = $_POST['username'];   $email = $_POST['email'];  $psw = password_hash($_POST['psw'], PA...

Home

This blog Is very help full for beginner coder,if you want to learn new things definitely this Blog is very
helpful for you guys.

Followers

Contact Form

Name

Email *

Message *

Blog

  • Home
  • About Us
  • Privacy Policy
  • Disclaimer
  • Contact Us
  • Terms&Conditions

NewsLetter

Copyright © SoftwareQuery | Powered by softwarequery
Design by ShubhamTiwari | Theme by softwarequery.com | Distributed By softwarequery/