Как передать $(".тип").val () для конкретного идентификатора строки в $(".тип").функция автозаполнения()

Я выбираю тип продукта со следующим кодом, который отлично работает. Моя проблема в том, что есть несколько .type. Я хотел бы вызвать код для конкретного .type. Родительский div типа .row' and each.строкиhas unique row id. I would like to pass $(".type").val() по определенным .row код

Как это сделать.

        $(function() {
            function log(message) {
                $("<div>").text(message).prependTo("#log");
                $("#log").scrollTop(0);
            }

            $(".type").autocomplete({
                source: function(request, response) {
                    $.ajax({
                        url: "autoProductType",
                        dataType: "json",
                        data: {
                            str: $(".type").val(),// This value
                            maxRows: 5
                        },
                        success: function(data) {
                            response($.map(data.productTypeList, function(item) {
                                console.log(item);
                                return {
                                    label: item.productType,
                                    value: item.productType,
                                    id: item.productTypeId
                                };
                            }));
                        },
                        error: function(data) {
                            alert(data.productTypeList);
                            console.log(typeof data);
                            console.log(data);
                            alert('error');
                        }
                    });
                },
                minLength: 1,
                select: function(event, ui) {
                    log(ui.item ?
                            "Selected: " + ui.item.label :
                            "Nothing selected, input was " + this.value);
                    var pid = $(this).parents('.row').attr('id');
                    $("#" + pid + " .typeId").val(ui.item.id);
                },
                open: function() {
                    $(this).removeClass("ui-corner-all").addClass("ui-corner-top");
                },
                close: function() {
                    $(this).removeClass("ui-corner-top").addClass("ui-corner-all");
                }
            });
        });
    </script>

Edit: я пытаюсь следовать, но это также не работает

 function get_row_dtl() {
            var pid = $(this).parents('.row').attr('id');
            var val = $('#' + pid + ' .type').val();
            return val;
        }

При автозаполнении

str: get_row_dtl(),

**Edit: * * пожалуйста, смотритескрипку здесь . Вот я создаю автозаполнение на тип. Мой автозавершитель работает правильно для первого типа (Здесь показаны все типы продуктов). Но для 2-го третьего и следующего он не показывает весь список продуктов, он показывает только то, что было выбрано в первом. Поэтому я хочу отобразить весь список продуктов (при автозаполнении) на 2-м и следующем типе