首页 > 解决方案 > 如何在 Django 中的表中添加减法选项

问题描述

我正在使用 Django 制作我的第一个应用程序。目标是有一个显示当前实验室试剂库存的表格。一旦试剂从存储中取出,用户将能够点击减去按钮从当前库存中减去。目前我有一个显示试剂名称和数量的表格。我想在表格中添加一列,该列有一个减去按钮,该按钮将从相应的试剂当前库存中减去一个。

谁能给我一些关于如何实现减法按钮的建议?任何帮助将非常感激。

models.py
class Reagentquant(models.Model):

    Name_Of_Reagent= models.TextField()
    Reagent_Quantity= models.TextField()
tables.py

class ReagentquantTable(tables.Table):
    class Meta:
        model = Reagentquant
        template_name = 'django_tables2/bootstrap4.html'
        row_attrs = {'reagent_id': 'reagent'}
    edit= TemplateColumn(template_name='inventory/update_column.html')
views.py

def reagentquant(request):
    table = ReagentquantTable(Reagentquant.objects.all())
    RequestConfig(request).configure(table)
    return render(request, 'inventory/quant.html', {'table': table})


class RemoveReagentView:
    def post(self, request, *args, **kwargs):
        reagent_id = request.POST['reagent_id']
        reagent = Reagentquant.objects.filter(id=reagent_id)

        reagent.update(Reagent_Quantity=F('Reagent_Quantity')-1)
        data = {"count": reagent.Reagent_Quantity}
        return JsonResponse(data)
template 

<a class="btn btn-info btn-sm">-</a>

<script type="text/javascript">

  $(document).on('click', 'odd', function (e) {  // Where `element_with_reagentID_class` is the common classname of ALL elements that have your `reagent_id` inserted into them
      e.preventDefault();

      var $this = $(this);
      var reagent_id = $this.attr('reagent')  // Where `reagent_id` is whatever the attribute is that you added

      $.ajax({
          type: "POST",
          url: "{% url 'inventory-quant' %}",  // Where `reagent_urlname` is the name of your URL specified in urls.py
          data: {reagent_id: reagent_id, csrfmiddlewaretoken: "{{ csrf_token }}"}
      })
      .done(function (response){
          console.log(response)
      })
  })}


</script>

/script>
</td>

                    </tr>



                    <tr scope="row" reagent_id="reagent" class="odd">

                            <td >17</td>

                            <td >CRP</td>

                            <td >22</td>

                            <td >

<a class="btn btn-info btn-sm" onClick="testMe()">-</a>

<script type="text/javascript">

  $(document).on('click', 'reagent', function (e) {  // Where `element_with_reagentID_class` is the common classname of ALL elements that have your `reagent_id` inserted into them
      e.preventDefault();

      var $this = $(this);
      var reagent_id = $this.attr('reagent')  // Where `reagent_id` is whatever the attribute is that you added

      $.ajax({
          type: "POST",
          url: "/quant",  // Where `reagent_urlname` is the name of your URL specified in urls.py
          data: {reagent_id: reagent_id, csrfmiddlewaretoken: "NjfgIlWzzSBwq8EJh5jsdIqns4tK6tMFLH4vEkUSWAHW5VCHigpVpmzkDPBwbyL3"}
      })
      .done(function (response){
          console.log(response)
      })
  })}


</script>
</td>

                    </tr>



                    <tr scope="row" reagent_id="reagent" class="even">

                            <td >20</td>

                            <td >MTX</td>

                            <td >22</td>

                            <td >

标签: pythondjango

解决方案


要更新数量,您可以执行以下操作:

class RemoveReagentView(View):
    def post(self, request, *args, **kwargs):
        reagent_id = request.POST['reagent_id']
        reagent = Reagentquant.objects.filter(id=reagent_id)

        reagent.update(Reagent_Quantity=F('Reagent_Quantity')-1)
        data = {"count": reagent.Reagent_Quantity}
        return JsonResponse(data)

下一步是将其连接到django_tables2渲染中。您最好的选择是添加该值的自定义行属性reagent.id,通过 Javascript 捕获它,然后使用 AJAX POST 请求调用RemoveReagentView()我在上面指定的视图。您显然还需要一个+/-按钮,您似乎可以使用此答案中的某些内容添加该按钮。

总的来说,这需要一些聪明的破解,但它似乎非常可行。

编辑

这是一个示例 AJAX 请求:

$(document).on('click', '.element_with_reagentID_class', function (e) {  // Where `element_with_reagentID_class` is the common classname of ALL elements that have your `reagent_id` inserted into them 
    e.preventDefault();
    
    var $this = $(this);
    var reagent_id = $this.attr('reagent_id')  // Where `reagent_id` is whatever the attribute is that you added

    $.ajax({
        type: "POST",
        url: "{% url 'reagent_urlname' %}",  // Where `reagent_urlname` is the name of your URL specified in urls.py
        data: {reagent_id: reagent_id, csrfmiddlewaretoken: "{{ csrf_token }}"} 
    })
    .done(function (response){
        console.log(response)
    })
})

推荐阅读