Как передать значение в модальное окно Bootstrap в Django

Я пытаюсь реализовать функцию, в которой я могу изменить продукт, передав его id в модальную страницу и изменив его там, затем отразить изменения на той же странице, где пользователь может нажать на название продукта, появится модальная страница с названием продукта и списком продуктов, затем он может изменить продукт из списка продуктов, нажать сохранить изменения, модальная страница закрывается, и продукт теперь обновлен.

Проблема в том, что я столкнулся с проблемой передачи id товара в модальный div, который существует в том же шаблоне, но не мог разобраться, затем я увидел подход Martín De la Fuente и попробовал его, но он не сработал и у меня.

Он показывает мне это сообщение об ошибке:

django.urls.exceptions.NoReverseMatch: Reverse for 'products_modal' not found. 'products_modal' is not a valid view function or pattern name.

Мой код выглядит следующим образом:

В шаблоне продукта:

Отправка идентификатора продукта в шаблон product_modal:

<td>
<a href="#" class="open-modal" data-url="{% url 'products_modal' product.id %}"><span>{{product.name}}</span></a> 
</td>

Создание пустого div для вставки в него product_modal:

<div id="product-modal-div"></div>

Часть Javascript:

<script>
   var productModalDiv=$("#product-modal-div")
   $(".open-modal").on("click",function(){
       $.ajax({
           url:$(this).attr("data-url"),
           success:function(data){
            productModalDiv.html(data);
            $("#ProductModal").modal();
           }
       })
   })
</script>

в модальном шаблоне продукта:

<div class="modal fade" id="ProductModal" tabindex="-1" role="dialog" aria-labelledby="ProductModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-lg modal-dialog-centered">
          <div class="modal-content">
            <div class="modal-header">
              <h5 class="modal-title" id="ProductModalLabel">Change</h5>
              <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                <span aria-hidden="true">&times;</span>
              </button>
            </div>
            <div class="modal-body">
                <form method="post">
                    <div class="form-group">
                        <label for="product" class="col-form-label">Product:</label>
                        <select class="custom-select" id="product">
                            {% for product in products_list %}
                            <option value="{{product.id}}" selected>{{product.name}}</option>
                            {% endfor %}
                        </select>
                    </div>
              </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-primary" data-dismiss="modal">Save Changes</button>
                <button type="button" class="btn btn-light border-primary text-primary" data-dismiss="modal">Cancel</button>
            </div>
          </div>
        </div>
      </div>

В urls.py:

path('products-modal/<int:product_id>', ProductsChange.as_view(), name='products_modal'),

В views.py:

class ProductsChange(ListView):
    model = Medicine
    template_name = 'pharmacy/products_modal.html'
    context_object_name = 'products_list'

    def get_queryset(self):
        queryset= super().get_queryset()
        queryset=queryset.filter(id=self.kwargs.get('product_id'))
        return queryset

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

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