2016-02-25 4 views
0

Я пытаюсь клонировать td и вставлять его в другую таблицу, добавляя новый столбец. Я достиг этого, но я не могу правильно присвоить имя. Мне нужно использовать 2 переменные.Добавление переменных в функцию Javascript

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"); 

Как вы можете видеть, переменные являются «storeId» и «newId». Проблема заключается в том, что я не могу добавить его в поле имени <input type....

Спасибо большое и извините мой плохой английский :)

+0

Ну, '' $ {var} ''не является синтаксисом, поддерживаемым Javascript (ES5-). Раньше вы использовали правильный синтаксис: '' '+ var +' ''. – deceze

ответ

2

Изменение одинарные кавычки (') в обратные кавычки (`), которые вызывают интерполяция этих двух переменных.

В частности:

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

Смотрите здесь, если Вам необходима дополнительная информация: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals

Для быстрой демонстрации запустите в консоли:

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

Примечание: ES6 и вверх. Проверьте свой браузер. Игнорировать пользователей в старых браузерах. VIVA LA ES2016!

Если вы хотите, чтобы наклониться для старых браузеров, изменить это:

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

Для этого:

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

грустное лицо

1

Вы можете объединить строки

  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>');