Programming Tutorials Browser Tutorials Articles Struts Tutorials Hibernate Tutorials

Search: 

  Tutorial: Simple Ajax Example

Ajax is the method of using Javascript, DHTML and the XMLHttpRequest object to perform a GET or POST and return a result without reloading the HTML page.

Tutorial Details:

HTML page


This is the HTML page with three JavaScript functions that perform the
XMLHttpRequest and subsequent update to the HTML page. (These are Ajax calls)


<html>

<head>

<title>Simple Ajax Example</title>

<script language="Javascript">

function xmlhttpPost(strURL) {

    var xmlHttpReq = false;

    var self = this;

    // Mozilla/Safari

    if (window.XMLHttpRequest) {

        self.xmlHttpReq = new XMLHttpRequest();

    }

    // IE

    else if (window.ActiveXObject) {

        self.xmlHttpReq = new ActiveXObject("Microsoft.XMLHTTP");

    }

    self.xmlHttpReq.open('POST', strURL, true);

    self.xmlHttpReq.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');

    self.xmlHttpReq.onreadystatechange = function() {

        if (self.xmlHttpReq.readyState == 4) {

            updatepage(self.xmlHttpReq.responseText);

        }

    }

    self.xmlHttpReq.send(getquerystring());

}



function getquerystring() {

    var form     = document.forms['f1'];

    var word = form.word.value;

    qstr = 'w=' + escape(word);  // NOTE: no '?' before querystring

    return qstr;

}



function updatepage(str){

    document.getElementById("result").innerHTML = str;

}

</script>

</head>



<form name="f1">

  <p>word: <input name="word" type="text">  

  <input value="Go" type="button" onclick='JavaScript:xmlhttpPost("/cgi-bin/simple-ajax-example.cgi")'></p>

  <div id="result"></div>

</form>

<div id=result></div>

</body>

</html>


 

Read Tutorial at: Click here to view the tutorial
Rate Tutorial: Simple Ajax Example

View Tutorial: Simple Ajax Example

Related Tutorials:

Displaying 1 - 50 of about 3276 Related Tutorials.

First Ajax Example
Ajax First Example,Ajax PHP Datetime Example,Free Ajax and PHP Example Ajax First Example - Print Date and Time...; In this section we will create a simple Ajax Application for displaying
 
Ajax - Asynchronous JavaScript and XML
; First Ajax Example In this section we will create a simple Ajax Application... are retrieved from the server side php script.    Ajax Example...; Ajax Login Example In this program you will learn  how to validate
 
Developing responsive Ajax based Applications with ajax technologies
; First Ajax Example In this section we will create a simple Ajax Application... are retrieved from the server side php script.    Ajax Example...; Ajax Login Example In this program you will learn  how to validate
 
Ajax Examples
Ajax technique is dynamic script loading. The concept is simple: create a new... code * The types of requests that you can make     Ajax Example... explains how to use Ajax with PHP and introduces the Simple Ajax Toolkit (Sajax
 
Open Source Ajax
Ajax world Example Show Time using Ajax...;    First Ajax Example In this section we will create a simple Ajax Application for displaying
 
Ajax Framework
(Simple Ajax Toolkit), is an open source tool for designing websites using the Ajax... small and simple javascript library to use Ajax on your pages. independent.... moo.ajax:- moo.ajax is a very simple ajax class, to be used with prototype.lite
 
Ajax - Asynchronous JavaScript and XML, What is Ajax?
What is Ajax - Asynchronous JavaScript and XML What is Ajax - Asynchronous JavaScript and XML     ... explains you the Ajax. You will learn the basics of Ajax. Ajax is of the most important
 
Div (Ajax Tag) tag Example
Tags Reference,Struts 2 Div Tag Div (Ajax Tag) tag Example...; In this section, you will learn about the div tag. The div tag is an Ajax component that is used with Ajax that refreshes the content of a particular
 
PHP Ajax Book
a simple online chat that works exclusively using AJAX code, without Java applets... and XSLT, to build a simple RSS aggregator. View AJAX RSS Reader Demo here: http... PHP Ajax Book PHP Ajax Book  
 
TabbedPanel (Ajax Tag) Example
Example,Tabbedpanel Struts2 TabbedPanel (Ajax Tag) Example            .... This is an Ajax component, where each tab is either a local content or a remote content
 
Ajax Registration Program
Ajax Registration Program Ajax Registration Program...;  In this Ajax Registration  program you will learn  how to validate the user registration through ajax call and then display
 
Example - Simple Calculator
Java: Example - Calc Main Java: Example - Simple Calculator Here is the source for the simple... place. Altho this simple example doesn't show the full power of separating
 
Login Form using Ajax
Struts 2 Ajax Example,Struts 2 Ajax,Login Form Using Ajax Login Form using Ajax        ... and complete implementation of login form using the Ajax (DOJO).  Lets develop
 
tree and treenode (Ajax Tag) tags Example
Tree Example,Struts 2 Tags,Struts 2 Tree,Tree in Struts tree and treenode (Ajax Tag) tags Example     ... about the tree and treenode tags. These both work with the Ajax support. tree
 
Simple Date example
Simple Date example, Date example Simple Date example         ...;    In this section we have presented a simple Date
 
Simple date formatter example
Simple date formatter example, date formatter Simple date formatter example      ...;        In this section of simple
 
Ajax Multiply Two Values
result on the html page. Example of Ajax multiplication program: <... Ajax Multiple program Ajax Multiplication Program...;  Ajax is a web development technique where you can send
 
Ajax Login Example
database. Example of Ajax login Program : <html> <head> <... Ajax Login Program Ajax Login Program... site. In this program we will show how you can send ajax request to authenticate
 
Simple Editor
Java: Example - Simple Editor Java: Example - Simple Editor This simple text editor uses... 103 // editor/NutPad.java -- A very simple text editor -- Fred Swartz
 
A simple example of log4j
A simple example of log4j A simple example of log4j          ...;    This Example shows you how to create a log
 
A simple example of log4j for Servlet
A simple example of log4j for Servlet A simple example of log4j for Servlet      ...;        This Example shows you how
 
Login or Cancel Application Using Ajax
Struts 2 Ajax Example,Struts 2 Ajax,Login or Cancel Application Using Ajax Login or Cancel Application Using Ajax  ... with features like submit and cancel buttons using the Ajax (DOJO). 
 
Simple Linked Lists
" The following program is an example of a very simple implementation of a singly-linked... Java: Simple Linked Lists Java Notes: Simple Linked Lists This shows three programs. A simple
 
Simple Font Paint Example
Simple Font Paint Example Simple Font Paint Example          ...;JFrame frame = new JFrame("Font Paint Example"
 
Simple Basic Stroke Example
Simple Basic Stroke Example Simple Basic Stroke Example                      
 
Simple Gradient Paint Example
Simple Gradient Paint Example Simple Gradient Paint Example                      
 
jQuery to Simple Image Scroller
jQuery Example, jQuery to Retrieve Server's Current Time, jQuery Server time jQuery to Simple Image Scroller  ...;   Create a new file (simple_carousel.html) and add the following code
 
XSD Simple Elements
XSD Simple Elements XSD Simple Elements...; simple element contains only text not even any other elements or attributes.But...; to a data type in order to limit its content. Defining a Simple Element The syntax
 
Simple Date Format Exception
.   Let Us Understand with Simple Example In this program Example we... Understand Simple Date Format Exception Example In this program code we want... Simple Date Format Exception Simple Date Format
 
More About Simple Trigger
), null, 0, 0L); 2. Example SimpleTrigger : Create a simple trigger that fires..._INDEFINITELY, 10L * 1000L); 4. Example SimpleTrigger: Create a Simple Trigger that fires... More About Simple Trigger More About Simple
 
Developing Simple Struts Tiles Application
Developing Simple Struts Tiles Application Developing Simple Struts Tiles Application     ... In this section  I will show you how to develop simple Struts Tiles Application
 
Developing Simple Struts Tiles Application
Developing Simple Struts Tiles Application Developing Simple Struts Tiles Application     ... In this section  I will show you how to develop simple Struts Tiles Application
 
Building a Simple EJB Application ?A Tutorial
Building a Simple EJB Application ?A Tutorial Building a Simple EJB Application ?A Tutorial     ... a simple session EJB and a client web application using eclipse IDE along
 
Simple Counter In Servlet
Servlets Counter Example,Simple Counter in Java Servlet,Free Counter Example Using Java Servlet Simple Counter in Servlet...; In this example we are going to know how we can make a program
 
Simple Query on RDF file in Java
examples, so in this section we are going to describe how to run simple query on the RDF graph model. Now lets see the example that can fires a simple query... simple Query on RDF file in Java Simple Query
 
Methods - Example
Java: Methods - Example Java NotesMethods - Example Example This example shows a simple..., but this is a common style. The body of this simple function contains a declaration
 
Ajax Training
Ajax Training Ajax Training...;     Ajax (Asynchronous JavaScript and XML) is a web development technique used for developing website more interactive. Ajax helps you
 
JOptionPane - Simple Dialogs
Java: JOptionPane - Simple Dialogs...: JOptionPane - Simple Dialogs Here are two useful static methods from... will be centered on the screen. Example This program produces the dialog boxes below. 1
 
Ajax Training Course
Ajax Training Course Ajax Training Course...; Ajax Training Course Objectives Using  Ajax to make a call to the server without refreshing a page
 
Very simple `Hello world' java program that prints HelloWorld
Very simple `Hello world' java program that prints HelloWorld Hello World Java Simple Java... language and  it is used to develop robust applications. Writing a simple Hello
 
JSF Simple Login Application
JSF Simple Login Application JSF Simple Login.... You will know how JSF works after following the example. This section here provides you a simple but the important thing for protecting your any type of web
 
Simple JSF Hello Application
Simple JSF Hello Application Simple JSF Hello... to follow to create own JSF application. In this example we will explain all you need... structure of the application etc. A detailed explanation of this example
 
Struts 2 Ajax
Struts 2 Ajax Struts 2 Ajax    ... explain you Ajax based development in Struts 2. Struts 2 provides built-in support for Ajax using Dojo toolkit. This is one of the greatest feature added
 
Combo Box Using Ajax In JSP
Combo Box Using Ajax In JSP Combo Box Using Ajax In JSP         ... to Select the Data from database using Ajax in combo box. We created two file
 
Open Source PHP
AJAX applications. The fundamental idea behind AJAX (Asynchronous JavaScript... mean an entire web site powered by AJAX, or it could mean a subset of a form.... It gives many benefits to you and us. For example, if you need some special
 
For Simple Calculation and Output
<c: out> For Simple Calculation and Output <c: out> For Simple Calculation and Output   ...;, > etc to their character encoding codes.  In this example we have
 
The Simple API for XML (SAX) APIs
The Simple API for XML (SAX) APIs The Simple API... doing more sophisticated SAX processing, for example, to process... it easier to use SAX -- for example, by defining a default handler
 
Simple Hash Table implementation in Java
Simple Hash Table implementation in Java Simple... the software in very efficient manner. Program Description: Here, an example with complete..., true);     } } Download this example
 
Popup Window using Ajax In JSP
Popup Window using Ajax In JSP Popup Window using Ajax In JSP        ... Window application using Ajax in JSP. For this, we will create the following
 
Insert Image into Mysql Database through Simple Java Code
Insert Image into Mysql Database through Simple Java Code...; This is detailed simple java code that how save image into mysql database... in same database. In the example given below we have used database 'mahendra
 
Site navigation
 

 

Send your comments, Suggestions or Queries regarding this site at roseindia_net@yahoo.com.

Copyright © 2006. All rights reserved.