Как получить идентификатор динамического поля ввода, используя функцию изменения поля выбора внутри строки в таблице?

Question

Проблема в том, что я не могу выбрать правильный входной идентификатор динамического поля внутри строки.

<script>
$('tbody').on('change', 'select',function(e) //Same row #itemDescription.
{
e.preventDefault();
var id = $(this).val();
$.ajax({
type:'get',
url:'{{ route("<add.findItem>") }}' ,
data:{id:id},
dataType:'json',//return data will be json
success:function(data)
{

//THIS IS THE PROBLEM, EVERY TIME THE SELECT CHANGES, IT WILL DISPLAY THE VALUE TO THE LAST CREATED INPUT FIELD NOT CURRENT INPUT FIELD INSIDE A ROW. 
FIELD.
$('#itemDescription_'+ count +'').val(data.itemDescription);
},
error:function()
{
alert("Error Occurred");
}
}
);
});
</script>

Я ожидаю, чтобы отобразить значения с правильным индексом внутри строки.

Answer 1

Чтобы получить значение выбора внутри строки таблицы

$(document).on('change', 'tbody tr select', function(){ 
   var dynamicInputVal = $(this).closest('tr').find("input[id^='itemDescription_']").val(); //This line must exactly be here, not in any other function

  $.ajax({
    type:'get',
    url:'{{ route("add.findItem") }}' ,
    data:{id:dynamicInputVal},
    dataType:'json',//return data will be json
    success:function(data){
       alert(dynamicInputVal)
    },
    error:function(){
       alert("Error Occurred");
    }
  });//end ajax



})

Ваш вопрос не понятен, где находится динамический input

Answer 2

Не видя структуру DOM, вам очень трудно с этим справиться, но, по сути, this в вашем change обратном вызове будет ссылаться на select, в котором произошло изменение. Вы можете использовать различные методы обхода jQuery , чтобы найти элементы рядом с этим конкретным select.

Например, он найдет первый input в той же строке, что и select, найдя ближайший содержащий tr элемент, а затем используя find искать в нем вход :first:

$('tbody').on('change', 'select',function(e) {
    var input = $(this).closest("tr").find("input:first");
    // ...
});

Тогда в вашем обратном вызове ajax вы будете использовать input.val(data.itemDescription);.