ajaxCFC Update: addOptions() - serializeForm()
I just updated the ajaxCFC distribution files to include an update to the addOptions() utility. The y! group has been talking about passing a CF Query to the addOptions() function for a few weeks and thanks to the contribution of Jeff Lester it's possible now. It behaves exactly like the addRows() function, where it takes _cell_ functions to get the value and text of the returned query. It is usually easier to learn by example, so check out how it's done.
Additionally, some of you must be familiar and frustrated with the lack of ability of passing an entire form as an object; if you try, you'd get an maximum recursion error. I wrote a small function in my contact manager example that takes a form and serialize it into a JavaScript object, so I chose to include it into the DWRUtil namespace... You can now call x = DWRUtil.serializeForm(document.frm) and pass it to your Ajax call.
Additionally, some of you must be familiar and frustrated with the lack of ability of passing an entire form as an object; if you try, you'd get an maximum recursion error. I wrote a small function in my contact manager example that takes a form and serialize it into a JavaScript object, so I chose to include it into the DWRUtil namespace... You can now call x = DWRUtil.serializeForm(document.frm) and pass it to your Ajax call.
TrackBacks
There are no trackbacks for this entry.
Trackback URL for this entry:
http://www.robgonda.com/blog/trackback.cfm?C5090FB5-3048-7431-E400742948EF3856
http://www.robgonda.com/blog/trackback.cfm?C5090FB5-3048-7431-E400742948EF3856
ajaxCFC rules!
Thanks, you're right. Should be easy, but if you already have it you can paste it here or drop me an email. rob[at]robgonda[dot]com
Cheers.
DWRUtil.serializeForm = function(frm,vals) {
if (!vals) {
var vals = {};
}
for (var loop=0; loop < frm.elements.length; loop++) {
if (frm.elements[loop].type == 'text' || frm.elements[loop].type == 'select-one' || frm.elements[loop].type == 'hidden' || frm.elements[loop].type == 'radio' || frm.elements[loop].type == 'textarea') {
vals[frm.elements[loop].name] = frm.elements[loop].value;
}
else if (frm.elements[loop].type == 'checkbox') {
if (frm.elements[loop].checked == true) {
if (vals[frm.elements[loop].name]) {
vals[frm.elements[loop].name] = vals[frm.elements[loop].name] + ',' + frm.elements[loop].value;
} else {
vals[frm.elements[loop].name] = frm.elements[loop].value;
}
}
}
else if (frm.elements[loop].type == 'select-multiple') {
var ob = frm.elements[loop];
for (var i = 0; i < ob.options.length; i++) {
if (ob.options[i].selected) {
if (vals[frm.elements[loop].name]) {
vals[frm.elements[loop].name] = vals[frm.elements[loop].name] + ',' + ob.options[i].value;
} else {
vals[frm.elements[loop].name] = ob.options[i].value;
}
}
}
}
}
return vals;
}
DWRUtil.serializeForm = function(frm,vals) {
if (!vals) {
var vals = {};
}
for (var loop=0; loop < frm.elements.length; loop++) {
var ob = frm.elements[loop];
if (ob.type == 'text' || ob.type == 'select-one' || ob.type == 'hidden' || ob.type == 'radio' || ob.type == 'textarea') {
vals[ob.name] = ob.value;
}
else if (ob.type == 'checkbox') {
if (ob.checked == true) {
if (vals[ob.name]) {
vals[ob.name] = vals[ob.name] + ',' + ob.value;
} else {
vals[ob.name] = ob.value;
}
}
}
else if (frm.elements[loop].type == 'select-multiple') {
for (var i = 0; i < ob.options.length; i++) {
if (ob.options[i].selected) {
if (vals[ob.name]) {
vals[ob.name] = vals[ob.name] + ',' + ob.options[i].value;
} else {
vals[ob.name] = ob.options[i].value;
}
}
}
}
}
return vals;
}
<form onsubmit="doFormTest(this);return false;">
<input type="Text" name="f1">
<input type="Text" name="f2">
<input type="submit" value="enter">
</form>
function doFormTest(frm) {
// send data to CF
DWREngine._execute('myFormTest.cfc', null, 'echo', DWRUtil.serializeForm(frm) , doFormTestResult);
}
---
<cffunction name="echo" output="no" access="private">
<cfargument name="formVars" required="Yes" type="struct">
<cfreturn structkeylist(arguments.formVars) />
</cffunction>
I linked an example of addOptions in the blog post, and as far as the serialize form, all contact manager examples for the model glue and machii frameworks are using it. I can write a simpler one if you wish.
~Rob
Thanks
else if ((ob.type == 'radio') && (ob.checked == true)) {
vals[ob.name] = ob.value;
}
The are two form fields (doctitle & docduedate). I call the javascript with postForm(this) from the onSubmit() event. I can get the value using frm.doctitle.value, but when I call DWRUtil.serializeForm(frm), it generates a blank string.
What am I missing here, anyone?
Thanks for the suggestion; I will probably incorporate those changes in my next release.