Почему не распознается переменная при ее подстановке в строку?

Question

[alexei_2002]

Пробовал несколько вариантов, во всех случаях возвращает undefined

i = 1;
tempvar_surname = $(`.c_ipt_surname${i}`).val();

tempvar_surname = $('.c_ipt_surname'+i).val();

tempvar_surname = $('.c_ipt_surname'+(i)).val();

Answer 1

[Mark Lansky]

Первый вариант правильный. Что именно у тебя возвращает undefined? Функция val()?

Попробуй задебажить это поэтапно:

1. Создай константу в которой будет хранится строка с нужным тебе селектором:
   

   const selectorString = `.c_ipt_surname${i}`
   console.log({ selectorString })

   
   
2. Получи DOM элемент:
   

   const surnameElement = $(selectorString)
   console.log({ surnameElement })

   
   
3. Получи значение, которое ввёл юзер:
   

   const surname = surnameElement.val()
   console.log({ surname })

   
   

Последним пунктом я бы посоветовал выпилить jq и больше никогда им не пользоваться. Но этот пункт слишком opionated, я не стал его включать.

Comments

[alexei_2002]

Вот что получилось

{selectorString: '.c_ipt_surname1'}
{surnameElement: jQuery.fn.init(0)}
{surname: undefined}

Во второй строке не понятное значение получается

[Mark Lansky]

alexei_2002, Я глянул доки по жиквери (упаси боже). Ты используешь класс в качестве селектора. Поэтому эта функция $ возвращает тебе массив (элементов с таким классом в теории может быть много, так ведь?). Используй айдишники, либо пиши вот так $('.c_ipt_surname'+i)[0].val() (костыль, просто первый элемент списка).
Вот документация, сиди копайся: https://api.jquery.com/val/

Обрати внимание, что в примерах используются селекторы, которые не могут вернуть больше одного DOM элемента

[Mark Lansky]

alexei_2002, в любом случае, на поставленный вопрос я ответил. Переменная у тебя подставляется, всё хорошо. Проблема в другом, я рассказал как найти проблему и решить её. Если всё ок, отметь мой ответ как решение твоего вопроса. Спасибо!

[alexei_2002]

ZerdoX-x, я разобрался, благодарю за помощь

Answer 2

[alexei_2002]

Решение вопроса:
Необходимо было использовать id
tempvar_surname = $(`#ipt_surname${i}`).val();