Can't replace hard-coded property name value with variable value in function call

Question

I'm trying to use the unobtrusive date picker in an old liferay project (3.6) which I believe is running prototype.js.

I have a call like this:

datePickerController.createDatePicker({formElements:{"elementId":"%d/%m/%Y"}});

made to this:

createDatePicker:       function(options) { addDatePicker(options); },

I've not been able to use a variable in place of a hard-coded elementId. I've tried array indexing, dot indexing, string variable, etc. but can't get it to work.

It looks to me like the called function only wants a generally unspecified object, yet if I do one of the above (array, dot, etc.) the browser complains about the bracket (array indexed), the dot (dot indexing), parens or anything other than the expected format.

The underlying called module (addDatePicker) expects formElements so I can't change that.

I don't understand how the browser knows enough to complain about the format of the function's parameter...obviously I'm seriously lacking here!

Pointers greatly appreciated.

e.g.

obj[tag] = 'elementId'; 
datePickerController.createDatePicker({formElements:{obj[tag]:"%d/%m/%Y"}});     
// SCRIPT1003: Expected ':'

Answer 1

You can't put a variable key in an object literal - the syntax requires that the keys be constant values.

You'll need to create the object and fill it, and then pass it:

var obj = {};
var tag = 'elementId';
obj[tag] = "%d/%m/%Y";
// you now have obj = { elementId: "%d/%m/%Y" }

...createDatePicker({ formElements: obj });