Adding variables in Javascript's function

Question

I am trying to clone an td and inserting it to another table adding a new column.. I achieved it, but I can't assign properly a name.. I need to use 2 variables.

console.log("Store Id: "+storeId+"///Product Id:"+newId);

var cloned = $(self).parents('tr').clone();
cloned.find('td').eq(5).after('<td class=""><input type="text" name="product_order_${storeId}_${newId}" id="order_input_cat" value="" class="input-text no-changes" /></td>');  
cloned.appendTo("#products #productOnCatGrid_table tbody");

As you can see, the variables are "storeId" and "newId". The problem is that I can't add it into the name field of <input type....

Thanks a lot, and sorry my bad english :)

Well, '${var}' is not a syntax supported by Javascript (ES5-). You've used the correct syntax earlier: '' + var + ''. — deceze
– deceze ♦, Commented Feb 25, 2016 at 10:21

Adrian Lynch · Accepted Answer · 2016-02-25 10:45:57Z

2

Change the single quotes (') to backticks (`) which will cause an interpolation of those two variables.

Specifically:

.after(`<td class=""><input type="text" name="product_order_${storeId}_${newId}" id="order_input_cat" value="" class="input-text no-changes" /></td>`);

See here if you need more info: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals

For a quick demo run this in the console:

var x = 123
console.log(`What's the number? ${x} is the number!`)

Note: ES6 and up. Check your browser compat. Ignore users on older browsers. VIVA LA ES2016!

If you want to bend over for the older browsers, change this:

...name="product_order_${storeId}_${newId}"...

To this:

...name="product_order_' + storeId + '_' + newId + '"...

sad face

edited Feb 25, 2016 at 10:45

answered Feb 25, 2016 at 10:21

Adrian Lynch

8,5442 gold badges36 silver badges41 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Deblaton Jean-Philippe · Accepted Answer · 2016-02-25 10:21:17Z

1

You can concatenate strings

            cloned.find('td')
                  .eq(5)
                  .after('<td class=""><input type="text" name="product_orden_' 
                       + storeId 
                       + '_' 
                       + newId 
                       + '" id="orden_input_cat" value="" class="input-text no-changes" /></td>');

answered Feb 25, 2016 at 10:21

Deblaton Jean-Philippe

11.4k4 gold badges53 silver badges68 bronze badges

Collectives™ on Stack Overflow

Adding variables in Javascript's function

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related