// this ajax post example retrieves all fornm input data // from check boxes and select too //dsta goes thru the serialize function then to ajax then to your //data process script. going to sql or text database function serialize(form) { if (!form || !form.elements) return; var serial = [], i, j, first; var add = function (name, value) { serial.push(encodeURIComponent(name) + '=' + encodeURIComponent(value)); } var elems = form.elements; for (i = 0; i < elems.length; i += 1, first = false) { if (elems[i].name.length > 0) { /* don't include unnamed elements */ switch (elems[i].type) { case 'select-one': first = true; case 'select-multiple': for (j = 0; j < elems[i].options.length; j += 1) if (elems[i].options[j].selected) { add(elems[i].name, elems[i].options[j].value); if (first) break; /* stop searching for select-one */ } break; case 'checkbox': case 'radio': if (!elems[i].checked) break; /* else continue */ default: add(elems[i].name, elems[i].value); break; } } } return serial.join('&'); } function ajaxpost(oForm){ var form =oForm; var query = serialize(form);// cal the function above // Create our XMLHttpRequest object //var hr = createXHR(); var hr = new XMLHttpRequest(); var url = "ajaxsend.php";// php file to post to to process post data hr.open("POST", url, true); // Set content type header information for sending url encoded variables in the request hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); // Access the onreadystatechange event for the XMLHttpRequest object hr.onreadystatechange = function() { if(hr.readyState == 4 && hr.status == 200) { var return_data = hr.responseText; document.getElementById("myDiv").innerHTML = return_data;// div id to display poset data if desired } } // Send the data to PHP now... and wait for response to update the status div hr.send(query); // Actually execute the request document.getElementById("myDiv").innerHTML = "processing..."; }
Comment? Make it short an sweet: