CB AJAX form post

Communities ColdBox HMVC
1

Hi folks,

I’m looking into using Ajax calls with Coldbox for the first time so apologies is this is a total newbie question :wink:

I took at look at the coldbox dashboard to get an idea of how Luis has implemented.

I’m doing simple form like so (using jQuery):

$(’#SubmitMessage’).click(function()
{
var data = $(’#messageForm’).serialize();
doEventNOUI(‘myHandler.myFunction’, ‘contentDiv’, data);
});

doEventNOUI() is a function I found within the coldbox dashboard-js

function doEventNOUI(e, targetID, params, methodType, onComplete){
//set event
var pars = “event=” + e + “&”;
//Try to turn top frame.
try{parent.topframe.lon();} catch(err){null;}
//Check for Method.
var methodType = (methodType == null) ? “GET” : methodType;
//onComplete
var onComplete = (onComplete == null) ? h_onCompleteNOUI : onComplete;
//parse params
for(p in params) pars = pars + p + “=” + escape(params[p]) + “&”;

//do Ajax Updater
$.ajax( {type: methodType,
url:“index.cfm”,
dataType:“html”,
data: pars,
error: h_callError,
complete: h_onComplete,
success: function(req){
$("#"+targetID).html(req)}
});
}

When I alert the data var I see the serialized form values in the proper name/value pair format, however when the request is sent the data parameters become.

http://local.myapp.com/index.cfm?event=myApp.myHandler&0=p&1=a&2=y&3=l&4=o&5=a&6=d&7=%3D&8=t&9=e&10=s&11=t&12=%26&13=u&14=s&15=e&16=r&17=i&18=d&19=%3D&20=3&21=4&22=9&23=%26&24=c&25=h&26=a&27=n&28=n&29=e&30=l&31=%3D&32=3&33=%26&34=i&35=n&36=c&37=i&38=d&39=e&40=n&41=t&42=i&43=d&44=%3D&45=6&46=2&47=3&48=%26&49=e&50=v&51=e&52=n&53=t&54=_&55=t&56=y&57=p&58=e&59=%3D&60=6&

I guess this is almost a jQuery question, but figured that someone on the list might know what is going on.

Thoughts?

Thanks guys.

Nolan

2

Nolan,

What i see here looks like you are trying to serialize the data params twice, once in the click handler when you serialize the form data before passing it to doEventNOUI… and once in the doEventNOUI function when it loops over the params and tries to query string it again…

If your seeing the correct format in the dump of the data after the form serialize, then maybe you can try remove the extra paraming loop in doEventNOUI and check the results…
I’m not sure the get / post that Bill mentioned has anything to do with the inproper parameter serialization you are seeing, but that could still be a problem later depending on exactly what your doing.

Try this first and let me know if it helps.

$(’#SubmitMessage’).click(function()
{
var data = $(’#messageForm’).serialize();
doEventNOUI(‘myHandler.myFunction’, ‘contentDiv’, data);
});

function doEventNOUI(e, targetID, params, methodType, onComplete){
//set event
var pars = “event=” + e + “&”;
//Try to turn top frame.
try{parent.topframe.lon();} catch(err){null;}
//Check for Method.
var methodType = (methodType == null) ? “GET” : methodType;
//onComplete
var onComplete = (onComplete == null) ? h_onCompleteNOUI : onComplete;

//do Ajax Updater
$.ajax( {type: methodType,
url:“index.cfm”,
dataType:“html”,
data: params,
error: h_callError,
complete: h_onComplete,
success: function(req){
$("#"+targetID).html(req)}
});
}

3

Thanks guys. I will give this a try.

Nolan Dubeau

Load .,8,1

4

sorry, i missed something… try this to see if it helps.

function doEventNOUI(e, targetID, params, methodType, onComplete){
//set event
var pars = “event=” + e + “&” + params;
//Try to turn top frame.
try{parent.topframe.lon();} catch(err){null;}
//Check for Method.
var methodType = (methodType == null) ? “GET” : methodType;
//onComplete
var onComplete = (onComplete == null) ? h_onCompleteNOUI : onComplete;

//do Ajax Updater
$.ajax( {type: methodType,
url:“index.cfm”,
dataType:“html”,

data: pars,

error: h_callError,
complete: h_onComplete,
success: function(req){
$("#"+targetID).html(req)}
});
}