Ajax

jQuery Ajax
To perform an ajax call on a form submit.

jQuery(document).ready ( function  {    jQuery("#myForm").submit    ( function {       var myButton = document.getElementById( 'myButtom' ); var overviewId = jQuery("#overviewId").val; var overviewText = jQuery("#overviewText").val; var pageId = <%=pageId%> myButton.disabled = true; myButton.value = "processing"; jQuery.post (             "/overview/",            {               overviewId: overviewId, overviewText: overviewText, ID: pageId            },            function ( data )            {              jQuery("#feedback").html(data);               myButton.disabled = false;              myButton.value = "Update";             }        ); return false; }   );  }  );

&lt;div id="feedback"&gt;&lt;/div&gt; &lt;form id="myForm"&gt; &lt;input type="hidden" name="overviewId" id="overviewId" value="&lt;%=overviewId%&gt;" /&gt; &lt;input type="text" name="overviewText" id="overviewText" value="" /&gt; &lt;input type="submit" id="myButton" value="Update" /&gt; &lt;/form&gt;

Code Sample
Javascript function createXMLHttpRequest {   var ua ; if ( window . XMLHttpRequest ) {     try {       ua = new XMLHttpRequest  ; }      catch ( e ) {       ua = false ; }   }    else if ( window . ActiveXObject ) {     try {       ua = new ActiveXObject ( " Microsoft.XMLHTTP " ) ; }     catch ( e ) {       ua = false ; }   }    return ua ; }

var req = createXMLHttpRequest ; var reponseTargetId = " " ;

function handleResponse {  if ( req . readyState == 4 ) {    var response = req. responseText ; var update = new Array ; document. getElementById ( reponseTargetId ). innerHTML = response ; } }

function getContentFor ( categoryName ) {   reponseTargetId = categoryName ; var targetURL = " /categoryResponse.jsp?categoryName= " + categoryName ; //alert( targetURL ); req. open ( 'get', targetURL ) ; req. onreadystatechange = handleResponse  ; req. send ; return false ; }

Useful sites

 * Ajax loading gif generator