Simplest way to use Ajax with jquery inbuilt function

Most of the time we use very complex methods to implement ajax in any javascript library. The easiest we ever seen is of jquery.

Since we are fan of jquery so we using its simplest way to implement ajax.

Scenario:

We have html as :

<div id="target"></div>
<a href="#" class="click">Click me</a>

Now, we have to fill this div (target) on clicking hyperlink “click” with some external file , say “source.php”, using Ajax (without refeshing whole page).

Content of “source.php”:

 <?php
echo $_POST['name'].' and '.$_POST['class'];
?>

Jquery code for ajax :

$('.click').click(function(){
var postdata = "name=stone&class=fouth";
$.ajax({type: "POST",url: "source.php",data: postdata,success: function(msg){$('#target').html(msg)}});
});

and if you don’t want to pass a string from current page , you can use , the easiest way

$('.click').click(function(){
$('#target').load('someurl.php');
});

Content of “source.php”:

 <?php
echo 'stone and fourth';
?>

Thats it!!

Now when you will click on hyperlink , target div will fill with “stone and fourth” , without refreshing the whole page.

Cheers!

Recently Published

»

10 Best Prototyping Tools for UI/UX Designers

Website design for a client gets only successful if you follow their ...

»

Social Media Marketing: Strategy To Boost Ecommerce-Traffic

According to a recent study, the experts revealed that people aged ...

»

How Flutter Can Help Reduce Overall Mobile App Development Cost?

Before jumping on answering the question, let me first walk you ...

»

Which One is Better? DigitalOcean Or AWS?

Digitalocean or AWS: Picking a cloud service for your application or ...

»

Killing way to select Domain Name and Hosting

Planning to launch your online presence? We know it’s all very ...

»

7+ blogs to inspire how they made more than $200 in a day

On this page I want to go through the blogs on how they earn money ...

»

5 Best Practices to Make Responsive Web Design in 2020

According to statistics, 40.1% of the time spent on websites came ...

»

7 sites to download free stock videos for TikTok or YouTube

Many of us always wandering for free stock videos to integrate into ...

»

Website Uniqueness: How it affects your blog success?

Recently, more and more people use website builders ‘cause it is ...