Django - javascript - ajax не работает со строками, созданными на javascript

I have three classes lets say,

class Item(models.Model):
    id = models.AutoField(primary_key=True)  # Explicitly define the id column as the primary key
    itemref = models.IntegerField(blank=True, null=True)
    code = models.CharField(max_length=150, db_collation='Turkish_CI_AS', blank=True, null=True)
    tanimlama = models.CharField(max_length=150, db_collation='Turkish_CI_AS', blank=True, null=True)
    itemname = models.CharField(max_length=150, db_collation='Turkish_CI_AS', blank=True, null=True)

class SAFiche(models.Model):
     nothing important

class SALine(models.Model):
    safiche = models.ForeignKey(SAFiche, on_delete=models.CASCADE)
    item = models.ForeignKey('accounting.Item', on_delete=models.CASCADE)

В представлениях у меня есть ajax для автошаблона:

def item_autocomplete(request):

    query = request.GET.get('q', '')
    items = Item.objects.filter(
        Q(code__icontains=query) |
        Q(itemname__icontains=query) |
        Q(tanimlama__icontains=query)
    )[:10]  # Limit to 10 results

    results = []
    for item in items:
        label = f"{item.code or ''} - {item.itemname or item.tanimlama or ''}"
        results.append({
            'id': item.id,
            'label': label.strip(' -'),
        })
    return JsonResponse(results, safe=False)

Я правильно настроил отдых. Вот мои формы:

class SALineCreateForm(forms.ModelForm):
    urun_search = forms.CharField(
        label="Ürün Ara",
        required=False,
        widget=forms.TextInput(attrs={
            'placeholder': 'Ürün kodu veya adı...',
            'class': 'item-search-input border rounded p-2 w-full',
            'autocomplete': 'off'
        })
    )

    class Meta:
        model = SALine
        fields = [
            'urun', 'miktar'
        ]
        widgets = {
            'urun': forms.HiddenInput(),
            'miktar': forms.NumberInput(attrs={'class': 'w-full form-input rounded-md'}),

        }

    def __init__(self, *args, **kwargs):
        super().__init__(*args, **kwargs)
        # If editing an existing line, fill the search box with the item name
        if getattr(self.instance, 'urun_id', None):
            self.fields['urun_search'].initial = str(self.instance.urun)

SALineCreateFormSet = inlineformset_factory(
    SAFiche,
    SALine,
    form=SALineCreateForm,
    extra=1,        
    can_delete=True
)

Автокомплиментация хорошо работает с формами, созданными в строках. Однако, когда я использую javascript с кнопкой создания новых строк, урун-поле автокомплитируется. В консоли ничего не происходит, если я пишу что-либо во вновь созданные строки urun-поля. В чем может быть проблема? Как я могу ее решить?

Урун в переводе с турецкого означает «предмет».

Вот как я добавляю новые строки товаров:

<script>
    document.addEventListener('DOMContentLoaded', () => {
        const formsetContainer = document.getElementById('formset-container');
        const emptyFormTemplate = document.getElementById('empty-form-template').innerHTML;
        const addProductButton = document.getElementById('add-product');

        addProductButton.addEventListener('click', () => {
            // Get current form count from the management form
            const totalFormsInput = document.querySelector('#id_saline_set-TOTAL_FORMS');
            const totalForms = parseInt(totalFormsInput.value, 10);

            // Create a new form from the empty template
            const newFormHTML = emptyFormTemplate.replace(/__prefix__/g, totalForms);
            formsetContainer.insertAdjacentHTML('beforeend', newFormHTML);

            // Update the TOTAL_FORMS count
            totalFormsInput.value = totalForms + 1;
        });
    });
</script>

А это остальная часть js-кода, который обрабатывает автокомплит:

Вернуться на верх