Nov 18 2010
MooTools Form Snippet – Easy Ajax Form Submissions
I wrote this function a long time ago when I had just begun using MooTools. They likely have native functionality for this sort of thing, but I’m posting it anyways. Maybe I’ll build a class out of this one day and submit it to mooforge.
This function just gets all the data in a form and returns it in a string fit for AJAX communication over either HTTP POST and HTTP GET. Just pass the form element as the parameter. Works great for MooTools Ajax form submissions. You don’t even have to modify the Ajaax post/get object when adding new input fields, just modify your server-side code.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 | /** * returnXhrRequestFromFormStr * @param element (dom element) * @return string * @TODO: add support for radio buttons */ function returnXhrRequestFromFormStr(element) { var len = element.elements.length; var str = ''; if(typeof(element)=='string'){ element = $(element); } for (var i = 0; i < len; i++) { var e = element.elements[i]; if(e.id != '' && e.id != undefined) { if(e.type == 'text'){ // text elements str+= '&'+e.id+'='+encodeURI(escape(e.value)); } else if(e.type=='checkbox' && e.checked==true){ // checkbox is checked str+= '&'+e.id+'=1'; } else if(e.type=='checkbox' && e.checked==false){ // checkbox is not checked str+= '&'+e.id+'=0'; } else if(e.type=='radio' && e.checked==true) { str+= '&'+e.name+'='+encodeURI(escape(e.value)); } else if(e.type=='select-one') // select values should also include selectedIndexes text { var index = $(e.id).selectedIndex; if(index != -1){ str+= '&'+e.id+'_text='+encodeURI(escape(e.options[index].text)); str+= '&'+e.id+'='+encodeURI(escape(e.value)); } } else if(e.type=='select-multiple') // multiple select { var valueArr = new Array(); var textArr = new Array(); for(var j=0;j<e.length;j++){ if(e.options[j].selected==true){ valueArr.push(encodeURI(escape(e.options[j].value))); textArr.push(encodeURI(escape(e.options[j].text))); } } str+='&'+e.id+'_jsonValue='+JSON.encode(valueArr); str+='&'+e.id+'_jsonText='+JSON.encode(textArr); } else{ // all other elements str+= '&'+e.id+'='+encodeURI(escape(e.value)); } } } return str; } |
Drop me a comment if you like this post or have any questions/comments.
MySQL Trigger – How To, Example, Tutorial, and Syntax My Top 5 Favorite FREE Word Press Plugins

