20 Ajax Interview Questions and Answers

Dear Readers, Welcome to AJAX Interview questions with answers and explanation. These 20 solved AJAX questions will help you prepare for technical interviews and online selection tests during campus placement for freshers and job interviews for professionals.

After reading these tricky AJAX questions, you can easily attempt the objective type and multiple choice type questions on AJAX.

Which are limitations of AJAX?

- Back functionality can’t work because the dynamic pages won’t register themselves to the browsers cache. Hence the use Iframe will become required.
- The page cannot be bookmarked if it is developed using Ajax.
- If java script is not enabled, Ajax will stop working.
- Because different components of the pages are loaded at different times, response time may be slow.
- Because different components of the pages are loaded at different times it may create confusion for the user.

What is the difference between synchronous postback and asynchronous postback?

The difference between synchronous and asynchronous postback is as follows:

- Asynchronous postback renders only the part of the page which is needed; while, synchronous postback renders the entire page in a postback.
- Asynchronous postback executes only one postback at a time, that is, if you have two buttons doing asynchronous postback, the actions are executed one by one; while, - synchronous postback invoke all the actions at a time.
- Asynchronous postback only changes the update panel that invoke the postback; while, synchronous postback changes the entire page.

Why do we use the XMLHttpRequest object in AJAX?

- Javascript uses the XMLHttpRequest object to manipulate XML and other text data between client and server.
- AJAX applications use the XMLHttpRequest object to avoid the postback of entire page when the browser is communicating with server.
- The XMLHttpRequest object enables a client-side script to execute an HTTP request.
- For this functionality MSXML ActiveX component is used in earlier version of Internet Explorer. While, XMLHttpRequest is used in Internet Explorer 7 and other browsers, such as Mozilla, Firefox.

What are the new features included in the Microsoft AJAX library?

The new features included in the Microsoft AJAX library are as follows:

- Imperative syntax: AJAX library provide simple imperative syntax which is required to create and manage controls.
- Script loader: It is used to retrieve all scripts automatically which are required by one or more client component or control and executes them in the order in which they are received.
- Client data access: It’s used to access client data and display by client data control and client template.
- Client datacontext: It’s used to read and write the permission to data in a database.
- The AdoNetDataContext class - Supports to easily communicate to an ADO.NET Data Services service.

What are the new features of ASP.NET AJAX 4.0?

These features are as follows:

- It enables the application to bind the live data.
- It enables to render the client-side template.
- It enables declarative instantiation of client components.
- It provides observer pattern on JavaScript objects and arrays.
- It provides the facility to invoke ADO.NET data services and data contexts.
- It supports for the DataView control.

How many validation controls are supported in ASP.NET AJAX 4.0?

The following validation controls are supported in ASP.NET AJAX 4.0:

- FilteredTextBoxExtender : This validation is used to apply filtering to a text box.
- MaskedEditExtender and MaskedEditValidator : These validation controls are used to prevent a user to enter only a particular pattern of characters in the TextBox.
- ValidatorCalloutExtender : This validation is used to display a balloon tooltip containing the error message by attaching the ASP.NET validators.
- NoBot : It restricts the input forms automatically to be filled by spam/bot and used to ensure that the user is not a computer machine by the automated Public Turing test.
- PasswordStrengthExtender : It is used to find the strength of the password entered in the text box by checking the different strength related parameters.

What are the differences between AJAX and JavaScript?

The differences between AJAX and JavaScript are given as follows:

- AJAX sends request to the server and will not wait for the response.
- It will allow other operations on the page before it get response of previous request; whereas, JavaScript make a request to the server, will waits for response and will not allow other operation on the page during that time.
- In AJAX, the page will not get refreshed for downloading the whole page while JavaScript manages and controls a Web page after being downloaded.
- By using AJAX we can minimize the overload on the server because the script needs to request once while JavaScript posts the request that updates the script each time.

List the different states of XMLHttpRequest with their description.

The different states of the XMLHttpRequest object are as follows:

1) Uninitialized : It is the state in which the object has not been initialized.
2) Open: It is the state when the object has been created but the send function is not invoked.
3) Sent: It is the state when the send function is invoked but the status and headers are not available.
4) Receiving: It is the state when the data is received by the process.
5) Loaded: It is the state when the procedure is completed and the data is available.

Describe the AccordionExtender control.

- The AccordionExtender control is almost same as the CollapsiblePanelExtender control.
- It enables the grouping of multiple collapsible panels in a single control.
- It also manages the collapsed and expanded state of every panel and one panel will expand at a time.
- Using AccordionExtender control we can’t expand two or more panels at a time.

However, we can click the header templates of particular panel to display the hidden contents.

By default, one panel is always expanded in theAccordionExtender.

How do I provide internationalized AJAX interactions?

To provide internationalized AJAX components you need to do the following:

Set the charset of a page to an encoding which is provided by the target languages. The following meta declaration in your HTML/JSP page is used to set the content type:
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

In the page JavaScript ensure that the encoding of any parameters sent to the server is done. To achieve this JavaScript has the escape() function which will give Unicode escape strings containing localized text in hexadecimal format.

In the server side component set the character encoding using the HttpServletRequest.setCharacterEncoding() method. Before accessing the localized parameter with HttpServletRequest.getParameter() call. In the case of UTF this will be request.setCharactherEncoding("UTF-8");.

A server-side component returning AJAX responses requires to set the encoding of the response to the similar encoding used in the page.

response.setContentType("text/xml;charset=;UTF-8");
response.getWriter().write(" <response>Not valid </response>");

How do I submit a form or a part of a form without a page refresh?

When creating a form ensure that in the "form" element "onSubmit" attribute calls the JavaScript function that returns false.

<form onSubmit="doSubmit();return false;" >
<input type="text" id="myinput" /><input type="submit" id="btnSubmit" value="Save"/>
</form>

The other way is to associate a function with a form button in a similar way.

<form onSubmit="doSubmit();return false;" >
<input type="text" id="myinput" />
<input type="button" id="button1" onClick="doSubmit()" value="Save"/>
</form>

While you update the page it is recommended that you should wait to confirm that the AJAX update of the form data was successful before updating the data in your page. Otherwise, it is possible that the data is not updated properly and the user is not aware about it. It is suggested to display a loading message message when doing a partial update and after the successful AJAX interaction we can update the page.

How do I create a thread to do AJAX polling?

JavaScript does not provide threads. JavaScript functions are called after an event occurred on a page like the page is loaded, a mouse click, or a form element get focused.

You can make a timer by using the setTimeout which requires a function name and time in milliseconds as its arguments.

Calling the same function using loop which is given in the JavaScript example below.

function checkForMsg() {
// start AJAX interaction with handleCallback as the callback function
}

// callback for the request
function handleCallback() {

// do post processing
setTimeout("checkForMsg()", 20000);
}

Note that the checkForMessage will continue to loop infinitely. You may want to change the increment interval based on activity. You may also want to change the logic which will break the loop based on some AJAX response executing condition.

Describe the formats and protocols used by AJAX

- The client web page is creates the XmlHttpRequest, and thus the connection from the web page to an application on the server.
- Part of that connection determines how the response can be produced to the client code – via the use of a “callback” routine.
- The callback routine is called multiple times which come with a status code which indicates the reason for the invocation.
- When a request can be successfully completed by the server application, a response should also be produced.

Are there security issues with AJAX?

- JavaScript is in plain view to the user with by selecting view source of the page. JavaScript cannot access the local file system without the user's permission.
- An AJAX interaction can only be achieved with the servers-side component from which the page is loaded.
- A proxy pattern can be used for AJAX interactions with external services.
- We should take care that the application model is not exposed in such a way that our server-side components are at risk if a user to reverse engineer your application.
- Like any other web application we should use HTTPS to secure the connection when sensitive information is being exchanged.

What are Difference between Server-Side AJAX framework and Client-side AJAX framework?

- The server-side framework facilitates the developers to develop Ajax functionality, without gaining much knowledge of JavaScript.
- This framework supports server controls and components as well as the drag and drop features.
- This framework is usually preferred when you required to rapidly ajaxify an asp.net web page. The drawback is that a round trip will take place to the server to execute a client-side action.
- The Client-Side Framework allows you to build web applications with rich user-interactivity as that of a desktop application.
- It includes a set of JavaScript libraries, which is not dependent from ASP.NET. The functionalities of this library are enhanced in every release.

If there is an input in the text field what are all the functions which get executed?

We can execute following functions when there is an input in the text field.

1) Defines the url that we will sent to the server
2) A parameter is inserted to the input field’s content.
3) A parameter is inserted to restrict the server from the cache.
4) When a change is triggered statechange is invoked.
5) An XMLHTTP object having a given URL gets invoked
6) A request is sent to the server through HTTP.

What is an UpdatePanel Control?

An UpdatePanel control is a cover for server side controls which is to be partial postbacked on ajax enabled page.

All controls included in the UpdatePanel will be partial postbacked. Below is a small example of using an UpdatePanel.

<asp:ScriptManager runat=”server”>
</ asp:ScriptManager>
<asp:UpdatePanel runat=”server”>
<ContentTemplate>
<asp:Button runat=”server”></asp:Button>
</ContentTemplate>
</asp:UpdatePanel>

On clicking the button the page will be updated partially. There won’t be a full postback by the web page.

In this way the content beyond the update panel won’t be posted back to the server.

The contents in the updatepanel will be refreshed only.

How does one call a JavaScript function from the AJAX code?

- Ajax is a form of JavaScript, which uses XML Http Request objects which pass action event parameters to a method named “open”.
- In AJAX we can’t track the requests and responses in any order.
- ”XMLHttpRequest.open” is the function which uses action events as Parameters in URL.
- While “XMLHttp Request.send” sends the Request object either synchronously or asynchronously which depend on whether the option for the synchronous version is true or false.

Which is the purpose for using the ScriptManager?

The purposes of ScriptManager in ASP.NET AJAX are explained as following.

- It enables the Client-script functionality of the Microsoft AJAX Library and it also supports a custom script that we can send to the browser.
- It supports Partial-page rendering, which enable us to make partial page update without a postback.
- The ASP.NET AJAX UpdatePanel, Timer and UpdateProgress controls work with ScriptManager control to support partial-page rendering.
- It supports JavaScript proxy classes for Web services that provide client script which enable us to access Web services by exposing them as strongly typed objects.
- It provides JavaScript classes to deal with ASP.NET authentication and profile application services.

Which are the major ASP.NET Ajax Server Controls?

- Timer: This control is used to refresh the contents of a web page at already specified intervals of time.
- Script Manager: This is the heart of an AJAX enabled web page. To develop the partial page rendering, it is necessary to set the EnablePartialRendering property of the ScriptManager control to true.
- ScriptManagerProxy: A ScriptManagerProxy control passes references to a ScriptManager control in a master page to declare the Ajax behavior.
- UpdateProgress: This control is required to display the progress when an update action in partial page rendering process is in progress.
- UpdatePanel : Update panel is required to create partial page updates in an Ajax enabled web page. All the controls which we need to involve in partial page update we need to include them inside an UpdatePanel control.
AJAX and problem it solve
Ajax: It is a short for Asynchronous JavaScript and XML. It solves the problem of unnecessary data transfers and allows asynchronous processing and avoids unnecessary processing to be done by server.
What are the benefits of AJAX over Java applet?
What are the benefits of AJAX over Java applet? - The following are the benefits of AJAX over Java applet:
What is the disadvantage of AJAX?
Data is stored at the client side so crucial and confidential data should not be stored to avoid any kind of security issues
Post your comment
Discussion Board
Ajax interview
Thanking for sharing these questions on Ajax. It is quite helpful
vinod 05-19-2013
Ajax Interview Questions
Great list of questions!.

Find out some more questions here i found http://codershelpdesk.com/2012/06/16/ajax-interview-questions-part-i/
Sunny 06-16-2012
Ajax interview questions and answers.
How to control how long an Ajax request may last?

We can use the triggers of Script Manager or the property of AsyncPostBackTimeout to control the web page and the request which is being made to the server. A timed out request will be published when the page no longer remains available for debug. Example Code:

<asp:ScriptManager id="ScriptManager1" runat="server" AsyncPostBackTimeout="9000"/>

[Note: the values here are in seconds]

What is the ASP.NET Ajax Framework? What versions have been released so far?

ASP.NET Ajax Framework is a free framework that gets implemented for web applications. This provides lot of tools to create easy to use, efficient and interactive web applications that work on all the platforms and browsers. This framework includes reusable Ajax controls, access remote service methods, data accessing methods etc. The version which has been released till now is as follows:-

1 - ASP.NET Ajax Framework 1.0 (earlier release to this was called the Atlas)
2 - ASP.NET Ajax Framework 1.0 for ASP.NET 2.0
Rohit Sharma 12-11-2011
Ajax interview questions and answers.
What are the properties of the XmlHttpRequest object?
XmlHttpRequest is an API, used in scripting language such as JavaScript. It sends HTTP and HTTPS requests directly to the server and load the server response directly in the script. The properties of it are as follows:

onreadystatechange property: it is a special property that processes the responses from the server. Example code:

ajaxRequest.onreadystatechange = function()

{// code}

readystate property: status of server’s response is stored. Example code:

ajaxRequest.onreadystatechange = function()

{if(ajaxRequest.readyState == 4)

{// Code to get the data from server}

}

responsetext property: retrieval of the server response can be seen by this property. Example code:

ajaxRequest.onreadystatechange = function()

{if(ajaxRequest.readyState == 4)

{document.myForm.time.value = ajaxRequest.responseText;}

}
Rohit Sharma 12-11-2011
Ajax interview questions and answers.
How do I create a thread to do AJAX polling?
JavaScript as an integral part of AJAX, it works when an event happens or an action is being taken such as page load, mouse click etc. A timer can be set to take the function name and time as arguments. A thread will be created, the moment the function checkforMessage() will be called. The thread will continue to execute and the result of it will be pooled in the database. Example code:

Function checkForMessage()
{
// start AJAX interaction with processCallback as the callback function
}
// callback for the request
function processCallback()
{
// do post processing
setTimeout(“checkForMessage()”, 10000);
}

How many types of triggers are there in update panel?
Triggers are the stored procedures used in the database. There are 2 types of triggers in update panel, which are as follows:

1. PostBackTrigger : This trigger is the internal trigger of the update control. It doesn’t work asynchronously. It short circuits the control to do synchronous post back. For example Update control panel

2. AsyncPostBackTrigger : This trigger is a control, that is external to update control. It works synchronously. It wires up the control to do asynchronous post back.
Rohit Sharma 12-11-2011
Ajax interview questions and answers.
What are ASP.NET Ajax Extensions?
ASP.NET Ajax is a set of extensions developed by Microsoft in ASP.NET, to provide the functionality of AJAX. The extension provides configuration for localization and adaption without the use of Ajax. These are set of Ajax based controls that work in ASP.NET applications. It consists of the libraries to provide more support and functionality to applications. Few extension examples are:

ASP.NET Ajax Extensions 1.0 -> For ASP.NET 2.0

ASP.NET Ajax Extensions 3.5 -> For ASP.NET 3.5

What is the use of UpdatePanel Control?
UpdatePanel control is a server control that controls the updates of the web page without reloading, in ASP.NET. It can be done through a mechanism called as asynchronous postback. In this process, HTML of the page is sent by the server asynchronously through Ajax request. Triggers are used to control the content of it and allow refresh content to be loaded all the time. The example below shows that the content of the Update control is re-rendered every time the button is clicked.

<asp:Button ID="Button1" runat="server" Text="Refresh" />

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Button1" EventName="Click" />
</Triggers>
<ContentTemplate>
<span><%= DateTime.Now %></span>
</ContentTemplate>
</asp:UpdatePanel>
Rohit Sharma 12-11-2011
Ajax interview questions and answers.
How to handle concurrent requests in Ajax?

An array of XMLHttpRequest is used to create a new XMLHttpRequest that can be executed each time the concurrent request is being made. JavaScript allows more than one AJAX request to be executed at once. In this abstracted JavaScript object is being used in the form of XMLHttpRequest object. This object is named as AJAXInteraction. The function is shown below:

function AJAXInteraction(url, callback)

{ var req = init();
req.onreadystatechange = processRequest;

function init() {
if (window.XMLHttpRequest)

{ return new XMLHttpRequest(); }

else if (window.ActiveXObject)

{ return new ActiveXObject("Microsoft.XMLHTTP"); }

}

What is Dojo?

Dojo is a third-party JavaScript toolkit. It is used to create rich featured applications. It helps in saving time, increase the performance and deliver good result for the business. Dojo is an open source toolkit and also referred as “unified toolkit”. It is a DHTML toolkit which is good in solving difficult problems and it also helps developers to build easy to use web applications.
Rohit Sharma 12-11-2011
Ajax interview questions and answers
Differentiate between proxied and proxyless calls.
- Proxied calls - These are made through stub objects that mimic your PHP classes on the JavaScript side.
- Proxyless calls - These are made using utility javascript functions like HTML_AJAX.replace() and HTML_AJAX.append().

Ajax is just another name for XMLHttpRequest - Is it true?
- No. XMLHttpRequest is just a part of the Ajax equation.
Harshvardhan 12-6-2011