Динамический поиск HTMX с кнопкой "назад" в веб-браузере

Я хотел использовать динамический поиск по htmx в djnago, но у меня проблема: поиск работает, но после входа в DetailView искомого элемента и возврата в ListView кнопкой назад в браузере, в inputs есть данные поиска, но фильтр не работает, у меня полный список.

Форма поиска:

<form id="serach_form" hx-post = "{% url 'geo_service:filter-ots' %}"
hx-target='#results'
hx-trigger="change">   
    {% csrf_token %}    
    <div class="row g-3 align-items-center pb-4">
        <div class="col-6">
          <input type="text"
          id="search_name_input"
          hx-post = "{% url 'geo_service:filter-ots' %}"
          hx-target='#results'
          hx-trigger="keyup changed delay:500ms"
          name="ots_search_name" 
          class="form-control"  
          placeholder="OTS Name input">
        </div>
        <div class="col-auto">
            <div class="form-check form-check-inline">
                <input class="form-check-input" type="checkbox" id="inlineCheckbox1" name="ots_search_otdrSupported" value="option1" checked>
                <label class="form-check-label" for="inlineCheckbox1">otdrSupported</label>
            </div>
            <div class="form-check form-check-inline">
                <input class="form-check-input" type="checkbox" name="ots_search_fiberAscStatus" id="inlineCheckbox2" value="option2" >
                <label class="form-check-label" for="inlineCheckbox2">fiberAscStatus</label>
            </div>
        </div>
      </div>
</form> 

Просмотров:

class OtsListView(LoginRequiredMixin, generic.ListView):
    template_name = 'geo_service/ots_list.html'
    queryset = ConnectionOts.objects.filter(active = True, otdrSupported = "Boolean_true")
   
def filter_ots(request):
    ots_search_name = request.POST.get('ots_search_name')
    ots_search_otdrSupported = request.POST.get('ots_search_otdrSupported')
    ots_search_fiberAscStatus = request.POST.get('ots_search_fiberAscStatus')

    condition = Q(guiLabel__icontains = ots_search_name)
    if ots_search_otdrSupported:
        condition &= Q(otdrSupported = "Boolean_true")
    if ots_search_fiberAscStatus:
        condition &= Q(fiberAscStatus = "Boolean_true")
 
    results = ConnectionOts.objects.filter(condition)
    context = {'object_list': results}
 
    return render(request, 'geo_service/partials/ots_results.html',context)

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

   var btnBack = performance.getEntriesByType("navigation");
    if (btnBack[0].type === "back_forward") {
        form_search = document.getElementById('serach_form')
        var event = new Event('change',{ bubbles: true })
        form_search.dispatchEvent(event);
    };

Буду благодарен за предложения о том, как это сделать.

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