Send AJAX Request to PHP using jQuery.


 PHP is a very commonly used language for backend web development. This is used to make dynamic websites with a database connection. Now there are two types of request that can be sent to a PHP file GET and POST. In the normal case if you sent any request a PHP file the page will be refreshed, which will surely decrease the User Experience. Also in some web applications it may happen that you have to send request to a PHP file very frequently. In these situations we have another way to send request and receive response from the PHP file. It can be done through Ajax or XMLHttp request. Normal Javascript can be used to write a code for AJAX but I will recommend jQuery to do this task as it is time saving and less code have to be written.

 At first include the jQuery CDN link above the closing </BODY> tag . You can get it from here-->

<script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous">
</script>

But always prefer the latest version from code.jquery.com . Now once jQuery is included let's write the code. Open and close <script> tag after the jQuery CDN script. Inside the script tags write the code for ajax like below( considering POST request to index.php file with a dataset of username and password)

<script>

var username = "John123";
var password = "qwer1234";
 $.ajax({
                type: 'POST',
                url: 'index.php',
                data: {
                    username: username,
                    password: password
                },
                success: function(response) {
                     console.log(response);
                }
            });
</script>

and after the request success the response will come also from PHP file. We then use the response to do show a message to user may be you are successfully logged in or your message has been sent .. etc . Inside PHP file we will retrieve data and send response like below.


<?php 
  $username = $_POST['username'];
  $password = $_POST['password'];
  $response = $username.'<br />'.$password;
  exit($response);
  ?>

That's all for this post, hope you guys understood the main concept and now you can play around and do various stuff. You can use this method in websites in many ways :

1. May be submitting data of your contact form.

2. Post comment in commenting system.

3. Retrieve data after a interval repeatedly in a Real time chat application.

  Very interestingly, these are also great project ideas for your PHP development. Hope you all enjoyed the content. Any doubts let me know in comments. Thank you 😌 Have a nice day........

Imon Raj

Software, Web & Android Developer

My Skills:

Comments

Popular posts from this blog

Which one is better ? GeeksForGeeks or Leetcode ? How many questions to solve ?

Random jokes generator using API (Free)