﻿  /////////////////////////////////////////////////////////////////////////
 //////////Copyright � William J. Familia (wjfamilia@gmail.com)///////////
/////////////////////////////////////////////////////////////////////////
function ajaxRequest(url, submitMethod, sourceElementID, targetElementID) 
{
	//url             = This is the path to the page that will process the submit and/or provide the content for population
	//submitMethod    = POST (form elements, but can grab QueryString values specified in the url) or GET (QueryString only)
	//sourceElementID = This is used when submitMethod = POST only. It is the id of the div that will contain all the form elements that are to be submitted. If submitMethod = GET, just pass something (null or "") for this parameter, but really does not matter what.
	//targetElementID = This is the id of the div that is to be populated with the http_request.responseText.

    //alert(url);

	var http_request = false;
	var isIEBrowser = false;
	var targetElement;
	try
	{   
	    targetElement = document.getElementById(targetElementID);
	    if(targetElement == null)
	    {
	        targetElement = parent.document.getElementById(targetElementID);
	    }
	}
	catch(er)
	{
	    targetElement = parent.document.getElementById(targetElementID);
	}
	var hiddenFormElement;
	try
	{
	    hiddenFormElement = document.getElementById("hiddenForm");
	    if(hiddenFormElement == null)
	    {
	        hiddenFormElement = parent.document.getElementById("hiddenForm");
	    }
	}
	catch(er)
	{
	    hiddenFormElement = parent.document.getElementById("hiddenForm");
	}
	
	
	if(navigator.appName == "Microsoft Internet Explorer")
	{
	    isIEBrowser = true;
	}

	if (window.XMLHttpRequest) // Mozilla, Safari, ...
	{
		http_request = new XMLHttpRequest();
	
		if (http_request.overrideMimeType) 
		{
			//http_request.overrideMimeType("text/xml");
			http_request.overrideMimeType('text/html');
		}
	}
	else if (window.ActiveXObject) // IE
	{ 
	    isIEBrowser = true;
		try 
		{
			http_request = new ActiveXObject("Msxml2.XMLHTTP");
		} 
		catch (e) 
		{
			try 
			{
				http_request = new ActiveXObject("Microsoft.XMLHTTP");
			} 
			catch (e) 
			{
			}
		}
	}
	
	if (!http_request) 
	{
		alert("ERROR: Cannot create an XMLHttpRequest instance");
		return false;
	}


	http_request.onreadystatechange = function() { if(populateTargetElement(http_request, targetElementID, url)){ return true; } };
	
	
	if(submitMethod.toLowerCase() == "post")
	{
		//This moves the form elements outside of the main form (nested forms is not allowed). MUST HAVE hidden div on page with id="hiddenForm" outside of any forms 	
		
		formElementID = "form" + sourceElementID;
		
		http_request.open("POST", url, true);
		http_request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
		http_request.setRequestHeader("Accept-Charset","UTF-8");
		
		if(!isIEBrowser)
		{
		    var tempContent = new String(document.getElementById(sourceElementID).innerHTML)
		    //alert(tempContent);
		    var rExp = /id=\"/gi;
		    replaceWithThis = new String ("id=\"_")
		    tempContent = tempContent.replace(rExp, replaceWithThis);
    		//alert(tempContent);
		    rExp = /id='/gi;
		    replaceWithThis = new String ("id='_")
		    tempContent = tempContent.replace(rExp, replaceWithThis);
		    //alert(tempContent);
		    hiddenFormElement.innerHTML = "<form id=\"form" + sourceElementID + "\" name=\"form" + sourceElementID + "\">" + tempContent + "</form>";
		    //alert(hiddenFormElement.innerHTML);
		    var formElements2;
		    try
	        {   
	            formElements2 = document.getElementById(formElementID).elements;
	            if(formElements2 == null)
	            {
	                formElements2 = parent.document.getElementById(formElementID).elements;
	            }
	        }
	        catch(er)
	        {
	            formElements2 = parent.document.getElementById(formElementID).elements;
	        }
		    
		    var formElement2;
		    
		    for(var i2 = 0; i2 < formElements2.length; i2++)
		    {
				//IMPORTANT: for FireFox need to loop through the elements and assign them the values. For some reason the field changes are not reflected with innerHTML
				try
                {   
                    document.getElementById(formElements2[i2].id).value = document.getElementById(formElements2[i2].id.substr(1)).value;
                }
                catch(er)
                {
                    try
					{   
						parent.document.getElementById(formElements2[i2].id).value = parent.document.getElementById(formElements2[i2].id.substr(1)).value;
					}
					catch(er)
					{
						try
						{   
							document.getElementById(formElements2[i2].id).value = parent.document.getElementById(formElements2[i2].id.substr(1)).value;
						}
						catch(er)
						{
							parent.document.getElementById(formElements2[i2].id).value = document.getElementById(formElements2[i2].id.substr(1)).value;
						}
					}
                }
				
			    if(formElements2[i2].type == "select-multiple")
			    {
		            try
	                {   
	                    formElement2 = document.getElementById(formElements2[i2].name);
	                    if(formElement2 == null)
	                    {
	                        formElement2 = parent.document.getElementById(formElements2[i2].name);
	                    }
	                }
	                catch(er)
	                {
	                    formElement2 = parent.document.getElementById(formElements2[i2].name);
	                }
			        
			        for(var formElementOptionIndex2 = 0; formElementOptionIndex2 < formElement2.length; formElementOptionIndex2++) 
				    {
				        //alert(formElement2.options[formElementOptionIndex2].value + ":" + formElement2.options[formElementOptionIndex2].selected);
				        formElements2[i2].options[formElementOptionIndex2].selected = formElement2.options[formElementOptionIndex2].selected;
				    }
			    }
		    }
		}
		else
		{
		    hiddenFormElement.innerHTML = "<form id=\"form" + sourceElementID + "\" name=\"form" + sourceElementID + "\">" + document.getElementById(sourceElementID).innerHTML + "</form>";
		    //alert(hiddenFormElement.innerHTML);
		}

		var formElements;
		try
        {   
            formElements = document.getElementById(formElementID).elements;
            if(formElements == null)
            {
                formElements = parent.document.getElementById(formElementID).elements;
            }
        }
        catch(er)
        {
            formElements = parent.document.getElementById(formElementID).elements;
        }

		var postVars = "";
		var firstPostVar = true;
		
		var formElementWithUnderScore;
		var formElement;
		
		for(var i = 0; i < formElements.length; i++)
		{
			var tempPostVarValue = formElements[i].value;
			
			regExp1 = /=/gi;
			regExp2 = /&/gi;
			tempPostVarValue = tempPostVarValue.replace(regExp1, "%3d");
			tempPostVarValue = tempPostVarValue.replace(regExp2, "%26");
			
			tempPostVarValue = encodeURI(tempPostVarValue);
			
		    try
            {   
                formElementWithUnderScore = document.getElementById("_" + formElements[i].name);
                if(formElementWithUnderScore == null)
                {
                    formElementWithUnderScore = parent.document.getElementById("_" + formElements[i].name);
                }
            }
            catch(er)
            {
                formElementWithUnderScore = parent.document.getElementById("_" + formElements[i].name);
            }
            
            try
            {   
                formElement = document.getElementById(formElements[i].name);
                if(formElement == null)
                {
                    formElement = parent.document.getElementById(formElements[i].name);
                }
            }
            catch(er)
            {
                formElement = parent.document.getElementById(formElements[i].name);
            }
	                
			if(!firstPostVar)
			{
				postVars += "&";
			}

			//alert(formElements[i].name + ": " + formElements[i].type + ": " + formElements[i].value);
			
			if(formElements[i].type == "select-multiple")
			{
				postVars += formElements[i].name + "="
				
				firstSelectedOption = true;
				for(var formElementOptionIndex = 0; formElementOptionIndex < formElements[i].length; formElementOptionIndex++) 
				{
				    //alert(formElements[i].options[formElementOptionIndex].value + ":" + formElements[i].options[formElementOptionIndex].selected);
				    
					if(formElements[i].options[formElementOptionIndex].selected)
					{
						if(!firstSelectedOption)
						{
							postVars += ","
						}
						postVars += formElements[i].options[formElementOptionIndex].value.replace("=", "&#61;").replace("&", "&#38;");;
						
						firstSelectedOption = false;
					}
					
				}
			}
			else if(formElements[i].type == "checkbox" || formElements[i].type == "radio")
			{
			    if(!isIEBrowser)
		        {
			        formElementWithUnderScore.checked = formElement.checked;
			    }
			    postVars += formElements[i].name + "="
			    
			    if(formElements[i].checked)
			    {
			        postVars += tempPostVarValue;
			    }
			}
			else
			{
				if(!isIEBrowser)
		        {
			        formElementWithUnderScore.value = formElement.value;
			    }
			    //alert(formElements[i].name + "-->" + formElements[i].value);
			    //alert(formElements[i].name + "-->" + encodeURI(formElements[i].value));
				postVars += formElements[i].name + "=" + tempPostVarValue;
			}
			
			firstPostVar = false;
		}
		
		//targetElement.innerHTML = "<div style=\"text-align:center;\"><br /><br /><div><img src=\"/images/ajax-loader.gif\" /><br /><div class=\"AjaxLoad\">Loading</div></div></div>";
		
		http_request.setRequestHeader("Content-length", postVars.length);
      	//http_request.setRequestHeader("Connection", "close");
      	//alert("POST - " + url);
      	//alert(postVars);
		http_request.send(postVars);
	}
	else
	{
		//targetElement.innerHTML = "<div style=\"text-align:center;\"><br /><br /><div><img src=\"/images/ajax-loader.gif\" /><br /><div class=\"AjaxLoad\">Loading</div></div></div>";   
		//alert("GET - " + url);
		http_request.open("GET", url, true);
        http_request.send(null);
	}
}




function populateTargetElement(http_request, targetElementID, url)
{
    var targetElement;
	try
	{   
	    targetElement = document.getElementById(targetElementID);
	    if(targetElement == null)
	    {
	        targetElement = parent.document.getElementById(targetElementID);
	    }
	}
	catch(er)
	{
	    targetElement = parent.document.getElementById(targetElementID);
	}
		    
	if (http_request.readyState == 4)
	{
		if (http_request.status == 200)
		{
			//alert(http_request.responseText);
			targetElement.innerHTML = http_request.responseText;	

			if(http_request.responseText.indexOf("<!--<AJAXscript>") >= 0)
			{
			    eval(http_request.responseText.substring(http_request.responseText.indexOf("<!--<AJAXscript>") + 16, http_request.responseText.indexOf("</AJAXscript>-->")));
			    
			}
		} 
		else
		{
			//alert("ERROR: http_request.status != 200");
			targetElement.innerHTML = http_request.responseText;	
			//alert(url);
		}
	}
}