Javascript challenge. How do I achieve this with arrays? -

let's have:

 var directions = [ "name", "start_address", "end_address", "order_date" ]; 

i'm trying find slick, fast way turn array this:

  data: {   "directions[name]"          : directions_name.val(),   "directions[start_address]" : directions_start_address.val(),   "directions[end_address]"   : directions_end_address.val(),   "directions[order_date]"    : directions_order_date.val() }  

notice pattern. name of array "directions" prefix values. i'm interested how people can either or @ least suggest way me try.

any tips appreciated.

thanks!

edit **

thanks suggestions far. however, forgot mention array "directions" needs dynamic.

for example, use:

 places = ["name", "location"] 

should return

 data: {   "places[name]"     :  places_name.val(),   "places[location]" :  places_location.val() } 

 alpha = ["blue", "orange"] 

should return

 data: {   "alpha[blue]"   : alpha_blue.val(),   "alpha[orange]" : alpha_orange.val() } 

so pass array function , return data object.

  var directions = ["name", "start_address", .... ];  var data = somecoolfunction( directions ); 

hope makes sense.

** edit **************

i want thank help. ended going different route. after thinking it, decided put meta information in html form itself. and, stick naming convention. html form has information needs (without being bloated) tell jquery post information. ended doing (for interested):

     // addbox     // generic new object box.     function addbox(name, options) {         var self = this;         var title = "add " + name.charat(0).touppercase() + name.slice(1);         var url = name.match(/s$/) ? name.tolowercase() : name.tolowercase() + "s";         allfields.val(""); tips.text("");          $("#dialog-form-" + name).dialog( $.extend(default_dialog_options, {             title: title,             buttons: [                 {   // add button                     text: title,                     click: function(){                         var bvalid = true;                         allfields.removeclass( "ui-state-error" );                          var data = {};                         $("#dialog-form-" + name + " input[type=text]").each(function() {   // each fine small loops :-)                             var stripped_name = this["name"].replace(name + "_", "");                             data[name + "[" + stripped_name + "]"] = $("#dialog-form-" + name + " #" + name + "_" + stripped_name).val();                         });                          // verify required fields set                         $("#dialog-form-" + name + " input[type=text].required").each(function() {                             bvalid = bvalid && checklength( $(this), $(this).attr("name").replace("_", " "), 3, 64 );                         });                          // find sliders                         $("#dialog-form-" + name + " .slider").each( function() {                             data[name + "[" + $(this).attr("data-name") + "]"] = $(this).slider( "option", "value" );                         });                          data["trip_id"] = trip_id;                         if(options != null) {   $.extend(data, options); } // add optional key/values                         if(bvalid) {                             $(".ui-button").attr("disabled", true);                             $.ajax( { url : "/" + url, type : "post", data : data } );                         }                     }                 },                 { text: "cancel", click: function(){$( ).dialog( "close" );} }             ]         }));     } 

it's unclear want here. perhaps should give interface function want, , example of code sets sample variables , calls function.

what seem asking dynamically find variables have declared in environment, such directions_name , directions_start_address, , call val() method on each of them, construct dictionary mapping strings results. keys of dictionary contain javascript syntax. sure that's want?

function transform(name) {     var data = {};     var names = window[name];     (var i=0; i<names.length; i++)     {         data[name + "[" + names[i] + "]"] = window[name + "_" + names[i]].val();     }     return data; } 

edit: use jquery objects id instead of above approach (which looks global variables name):

function transform(name) {     var data = {};     var names = $("#" + name);     (var i=0; i<names.length; i++)     {         data[name + "[" + names[i] + "]"] = $("#" + name + "_" + names[i]).val();     }     return data; } 

this name in global space of window (which work in browser anyway). call function "directions" argument. example:

var directions = [ "name", "start_address", "end_address", "order_date" ]; var directions_name = {"val": function() {return "joe";}}; var directions_start_address = {"val": function() {return "14 x street";}}; var directions_end_address = {"val": function() {return "12 y street";}}; var directions_order_date = {"val": function() {return "1/2/3";}}; data = transform("directions"); 

is want?

(note: see else posted solution using $ , "#" ... think that's jquery syntax, right? works without jquery.)

edit: note lets use dynamic value "directions". i'm still not sure why want keys "directions[name]", "directions[start_address]", instead of "name", "start_address", etc. easier up.

edit: fixed sample code use functions in values. want? easier if weren't calling val() parens.