Jquery Ajax : Dynamic Function

Question

Hi there

I am trying to write a function which allows me to perform an ajax call dynamically, but am unsure how to make the key which is passed to the ajax call dynamic...

At the moment, my code is like this

$('#ajaxButton').click(function(){
    var form = $(this).parent().find(':input');
    var formVal = form.val();
    var objectName = form.attr('id');

    submitAjaxForm(formVal,objectName);

});    

function submitAjaxForm(formVal,objectName){
     data = {
             objectName : formVal
            }
     // Ajax Call
     $.post('handlers/' & objectName & '.cfc?method=save',data,function(){
           }
     });

Essentially, what I am trying to do, is pass a form fields value to a function that will process it, and then dynamically set the data key, and the handler.

Now I can dynamically set the handler using the objectName vaidable...but when I try and use this variable to set the data key, it doesnt like it..

I hope this makes sense..

Any ideas?

Thanks

Answer 1

Try using + rather than & when trying to stick your objectName in your url string.

$.post('handlers/' + objectName + '.cfc?method=save',data,function(){});

Also try doing this to set the value of data:

var data = {};
data[objectName] = formVal;

Answer 2

I think i may have discovered a potential way of doing it. Instead of using a map of keys and values, I just append my values directly to the query string

$('#ajaxButton').click(function(){
var form = $(this).parent().find(':input');
var formVal = form.val();
var objectName = form.attr('id');

submitAjaxForm(formVal,objectName);

});    

function submitAjaxForm(formVal,objectName){
  // Ajax Call
  $.post('handlers/' + objectName +'.cfc?method=save' + objectName + '=' + formval ,function(){
       }
 });