Как добавить в id тега input переменную?

Question

[Cepesh16]

по нажатию кнопки добавляю строку и input - логин и пароль

$('#btnAddEmployee').click(function() {
	$('#tableEmloyeeManagement tbody').append('<tr><td><input id="userID" class="border-0 bg-none" type="text" value="name user" disabled></td><td><input id="userPassword" class="border-0 bg-none" type="password" value="1234abcd" disabled></td><td><a id="editUserAndPassword" href="#"><i class="fas fa-edit mr-2"></i></a></td></tr>');
	})

проблема в том что у них всех одинаковый id прописан, и я не могу в новой строке редактировать поля, как можно вписать переменную в id?

Думаю увеличивать переменную каждый раз после вызова чтобы разные id были, вот только не знаю как вообще ее вставить input

Answer 1

[msdosx86]

const id = 123;
.append(`<input id="${id}" />`);

Comments

[Cepesh16]

Спасибо работает!

Подскажите еще пожалуйста, почему такая запись не работает?

var count = 0;
	var userID = 'userID' + count;

Нужно преобразования использовать?

[msdosx86]

Cepesh16, что именно не работает?

[Cepesh16]

msdosx86, внимательность моя не работает, не на то поле ввода смотрел)

но вот почему то счетчик не работает, в конце count++, но результат везде count 1...

var count = 1;
	var userID = 'userID ' + count;
	var passwordID = 'passwordId ' + count;
	$('#btnAddEmployee').click(function() {
		$('#tableEmloyeeManagement tbody').append(`<tr><td><input id="${userID}" class="border-0 bg-none" type="text" value="name user" disabled></td><td><input id="${passwordID}" class="border-0 bg-none" type="password" value="1234abcd" disabled></td><td><a id="editUserAndPassword" href="#"><i class="fas fa-edit mr-2"></i></a></td></tr>`);
		count++;
	})

Answer 2

[FeST1VaL]

1. Вы не можете редактировать тк стоит disabled.
2. Если правильно понял, то откуда то берете переменную и добавляете ее:

var id = 1;
.append('<input id="userID_'+id+'">');

Переменную можно изначально добавить на кнопке по которой кликаете в виде атрибута и при каждом клике по ней забирать переменную и увеличивать на 1

Answer 3

[Cepesh16]

Делаю вот так, но count почему то после клика не увеличивается

<script>
var count = 1;
  var userID = 'userID ' + count;
  var passwordID = 'passwordId ' + count;
  $('#btnAddEmployee').click(function() {
    $('#tableEmloyeeManagement tbody').append(`<tr><td><input id="${userID}" class="border-0 bg-none" type="text" value="name user" disabled></td><td><input id="${passwordID}" class="border-0 bg-none" type="password" value="1234abcd" disabled></td><td><a id="editUserAndPassword" href="#"><i class="fas fa-edit mr-2"></i></a></td></tr>`);
    count++;
  })
</script>

Comments

[irishmann]

не пишите комментарии в разделе ответов