Ajax in ASP.NET


Click Here And Get This Posted To YOU In PDF Format

Ajax in ASP.NET

Introduction to Ajax in ASP.NET

AJAX in ASP.NET is known as Asynchronous JavaScript and XML. It is all about updating functions of a web page, without loading it each and every time we open the webpage. It is a technique used to create very fast and dynamic web pages.

Ajax in ASP.NET is majorly used when the user is having dynamic content and has to be reloaded multiple times after the changes have been done. This technology also speeds up the response time of the page. It also has a user-friendly interface and interactive webpages.

Working of Ajax in ASP.NET

AJAX is the advanced version of the static pages that were used for a long time. AJAX is built for dynamic nature and a user-friendly environment. AJAX in ASP.NET works like the below-listed points.

The XMLHTTPRequest object is created from the browser and sent to the server-side.
The server will process the request sent by the browser and will send the data back to the browser with the requested detail.
The browser will process the data and update the content on the page.
Once the content is updated the user can view the data on the screen.

ajax

Assume you have an employee data entry portal and you have to add a new employee in the database. In the above flowchart, we can see that the client creates an XMLHTTP request with the requested data to the server. Here, the employee details will start by adding the first and last name of the employee.

On the web page that the user sees already a few employee details must be added in the database. It will show a few suggestions of the names present in the name matching the keyword. The server then sends the requested data back to the client. If the employee in the database is not added then a new entry will be created with his details.

Now the client will process the data sent by the server and the response time is faster as compared to other technologies used. Now the employee details are successfully added in the database, so if the details added recently has to be seen the user can simply enter the employee name and unique id to fetch the results on the screen. Here the user interface is very interactive and the response time is also less.

Examples of Ajax in ASP.NET

Here are some examples of Ajax in ASP.NET that are explained below:

Example #1

In this example, the button is created but the action will not be performed when we click the button.

Code:

<html>
<body>
<div id= “Demonstration”>
<h1> Example of AJAX </h1>
<h2> Let’s take examples on buttons</h2>
<button type=”button” > Click on this button </button>
</div>

Output:

Ajax in ASP.NET eg1

Example #2

In this example, by clicking on the button you need to redirect it to some other page, we can see how we can take action.

Code:

<!DOCTYPE html>
<html>
<body>
<p>Let’s see what the user is typing.</p>
<input type=”text” id=”textbox” oninput=”textfunction()”>
<p id=”text”></p>
<script>
function textfunction() {
var obj = document.getElementById(“textbox”).value;
document.getElementById(“text”).innerHTML = “The letters you are typing: ” + obj;
}
</script>
</body>
</html>

Output:

 eg2.1

 eg2.2

Example #3

In this example, we will discuss how to perform load function in ajax.

Code:

<html>
<body>
<div id=”Demonstration”>
<h3>AJAX EXAMPLE ON LOAD</h3>
<button type=”button” onclick=”load(‘ajax_load_GET.asp’, loadfunction)”>Click on this button
</button>
</div>
<script>
function load(url, copy_function) {
var xhttp;
xmlhttp=new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
copy_function(this);
}
};
xmlhttp.open(“GET”, url, true);
xmlhttp.send();
}
function loadfunction(xmlhttp) {
document.getElementById(“Demonstration”).innerHTML =
xmlhttp.responseText;
}
</script>
</body>
</html>

Output:

ajax eg3

Example #4

After clicking on the button the content of the asp file will get printed on the screen. There are two methods to retrieve the information i.e. GET and POST method.

Code:

<!DOCTYPE html>
<html>
<body>
<h3>AJAX EXAMPLE ON LOAD</h3>
<h3> This example is for POST method </h3>
<button type=”button” onclick=”loadPOST()”>Click on this button</button>
<p id=”Demonstration”></p>
<script>
function loadPOST() {
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById(“Demonstration”).innerHTML = this.responseText;
}
};
xmlhttp.open(“POST”, “ajax_load_POST.asp”, true);
xmlhttp.send();
}
</script>
</body>
</html>

Output:

ajax eg4

Features of Ajax in ASP.NET

The below listed are few important features of AJAX in ASP.NET.

Features of Ajax in ASP.NET

User-Friendly: This is one of the main features in Ajax where the user interface of the webpage is so flexible and comfortable for the user to use the page as he must have to fill all the details required.
Web page faster: This feature in AJAX is the primary one as it has been built for the same. This feature allows the webpage to create the request and the server response time within seconds. These features also make the webpage reload faster than the usual ones. We don’t have to reload the whole page all the time only the specific part has to be reloaded if it has been changed.
Server Independent technology: AJAX in asp.net can be used irrespective of any programming language like JavaScript, PHP, etc. Many languages support AJAX and its characteristics and features.
Performance: It is mainly used for its performance and speed of a webpage. The time taken from creating the XMLHTTP request to getting the data response back from the server is quick while using AJAX. So one of the major factors is used for performance basis on a webpage.
Support Browsers: AJAX is primarily used because it supports almost all the browsers used in the market. Apart from the concept that creates the XMLHTTP object, the processing will be the same for all the web browsers because JavaScript language is used in most of the web applications.
Interactive Applications: Using ajax is very easy for the developer or programmer to create more interactive and user-friendly web applications. As we know in today’s world everything is a two-way process where you have to put as well as get the data, so it is helpful in the two-way process where the client can interact with the server to the fetch as well as write the data.

Conclusion

In this article, we discussed the features of AJAX in asp.net and how it works in ASP.Net applications. Also, we discussed a few examples where AJAX is used and its characteristics. It is one of the most useful and powerful technology for the modern environment. It is highly used in social media sites like Facebook, Twitter, etc.

Recommended Articles

This is a guide to Ajax in ASP.NET. Here we discuss the working, features of Ajax in ASP.NET along with the examples and code implementation. You may also look at the following articles to learn more –

jQuery Ajax Methods
JSON vs AJAX
What is Ajax?
AJAX Interview Questions

The post Ajax in ASP.NET appeared first on EDUCBA.

Read more: educba.com

What's Your Reaction?

Cry Cry
0
Cry
Cute Cute
0
Cute
Damn Damn
0
Damn
Dislike Dislike
0
Dislike
Like Like
0
Like
Lol Lol
0
Lol
Love Love
0
Love
Win Win
0
Win
WTF WTF
0
WTF

Comments 0

Your email address will not be published. Required fields are marked *

Ajax in ASP.NET

log in

Become a part of our community!

Captcha!
Don't have an account?
sign up

reset password

Back to
log in

sign up

Join BoomBox Community

Captcha!
Back to
log in
Choose A Format
Personality quiz
Trivia quiz
Poll
Story
List
Open List
Ranked List
Meme
Video
Audio
Image