Question

Is it possible to recreate an object after it is loaded with a new value passed in by the user?

For example I have an object full of api call information including things like the name and the rest url with required attributes.

var masterCallList = [
   {'CallName':'GetMerchantData','CallUrl': '/Merchants/?MerchantId=' + MerchantId + '&ApiKey=' + ApiKey, 'CallType':'Get', 'Desc':''},
   {'CallName':'GetMerchantFeed','CallUrl': '/FeedReturnItems/?MerchantId=' + MerchantId + '&ApiKey=' + ApiKey', 'CallType':'Get' 'Desc':''}
];

On page load I loop through each call and build html elements from it including creating onclick events that then run the call.

$(document).ready(function(){   
    //create the call lists and page elements from the master
    BuildCallLists();

My problem is that I want to allow the user to change one of the variables, like merchantid, that they are requesting information on but when they are rebuilt they do not have the new value.

Answer 1

Instead of having CallUrl as a string, you can make it a function which takes parameters, e.g.:

var masterCallList = [
  {'CallName':'GetMerchantData','CallUrlFun': function(MerchantId, ApiKey) { return '/Merchants/?MerchantId=' + MerchantId + '&ApiKey=' + ApiKey; }, 'CallType':'Get', 'Desc':''},
  {'CallName':'GetMerchantFeed','CallUrlFun': function(MerchantId, ApiKey) { return '/FeedReturnItems/?MerchantId=' + MerchantId + '&ApiKey=' + ApiKey; }, 'CallType':'Get', 'Desc':''}
];

where CallUrlFun is the new function. Now you can call the function instead with the given parameters (MerchantId, ApiKey). Here’s a jsFiddle example:

• http://jsfiddle.net/ywVmy/

Another option would be to have a special moniker in the string and to string replaces, such as:

var masterCallList = [
  {'CallName':'GetMerchantData','CallUrlTemplate': '/Merchants/?MerchantId=##MerchantId##&ApiKey=##ApiKey##', 'CallType':'Get', 'Desc':''},
  {'CallName':'GetMerchantFeed','CallUrlTemplate': '/FeedReturnItems/?MerchantId=##MerchantId##&ApiKey=##ApiKey##', 'CallType':'Get', 'Desc':''}
];

where you have CallUrlTemplate containing the monikers ##MerchantId## and ##ApiKey##. Here’s an example jsFiddle:

• http://jsfiddle.net/ALbxC/

Incidentally, usually in JavaScript the variable names start with a lower case letter (e.g. merchantId instead of MerchantId).