Advanced Search

Return to Snippet

Revision: 36671
at November 24, 2010 20:49 by FatFolderDesigner
Updated Code 
function as(){
	var input = document.getElementById('form').elements
	var param = 'savetype=auto';
	for(var i=0; i!=input.length; i++){
		if(input[i].type != 'submit'){
			param = param+'&'+input[i].name+'='+input[i].value
		}
	}
	var ass=new XMLHttpRequest();
	ass.open('POST','save.php',true);
	ass.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
	ass.setRequestHeader("Content-length", param.length);
	ass.setRequestHeader("Connection", "close");
	ass.send(param);
	ass.onreadystatechange = function() {
		if(ass.readyState == 4 && ass.status == 200) {
			alert('your response code goes here');
		}
	}
}

Revision: 36670
at November 24, 2010 17:14 by FatFolderDesigner
Initial Code 
function as(){
	alert('start_get_data');
	var input = document.getElementById('form').elements
	var param = 'savetype=auto';
	for(var i=0; i!=input.length; i++){
		if(input[i].type != 'submit'){
			param = param+'&'+input[i].name+'='+input[i].value
		}
	}
	var ass=new XMLHttpRequest();
	ass.open('POST','save.php',true);
	ass.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
	ass.setRequestHeader("Content-length", param.length);
	ass.setRequestHeader("Connection", "close");
	ass.send(param);
	ass.onreadystatechange = function() {
		if(ass.readyState == 4 && ass.status == 200) {
			alert(ass.responseText);
		}
	}
}
Initial URL 
http://fatfolderdesign.com/48/code/javascript-auto-submit-form
Initial Description 
I was working on this for a new site ideal I have, though it might be useful for others. What this does it sent a AJAX POST request every time the as() function is called. Setting the form to run as() onkeyup will essentially make the form submit itself whenever updated. I play to use this as part of an auto submit save system.

You could also eave the method and action of a form blank and have it run this with an onclick on the submit button, submitting the form only when they want to but keeping them on the page.

UPDATE: demo of this working available at the URL.
Initial Title 
AJAX form autosubmit
Initial Tags 
ajax, forms
Initial Language 
JavaScript