时间戳

首页 > 解决方案 > 我如何从 jQuery Datatables 调用 django 视图？

jquery - 我如何从 jQuery Datatables 调用 django 视图？

问题描述

我正在使用数据表，并且正在尝试向它们添加一些带有操作的按钮。我想调用 django 视图函数，但我不确定如何在 jQuery Datatables 中实现这一点。当我有 django 模板时，很明显我可以说

<a href="{% url 'feedback:useredit' user.id %}" class="btn text-secondary px"-0>
                                            <i class="far fa-edit fa-lg"></i>

这将我重定向到 django 中的“useredit”视图功能。但这在没有 django 模板和 jQuery 数据表内部的情况下是行不通的。你们能给我一些提示如何实现这一目标吗？

             $(document).ready(function() {
                 var data;
                 fetch("http://192.168.2.85:8000/fetchapi/")
                    .then(response => response.json())
                    .then(json => data = json)
                    .then(() => {console.log(data);
                        $('#datatable').DataTable( {
                        data:           data.employees,
                        deferRender:    true,
                        scrollY:        false,
                        scrollX:        false,
                        scrollCollapse: true,
                        scroller:       true,
                        "columns": [
                            { data: "id" }, 
                            { data: "first_name" }, 
                            { data: "last_name" },
                            { data: "email" }, 
             
                                { "data" : null, render: function ( data, type, row ) {
                                    return '<button class="btn-view" type="button">Edit</button>';
                                } },
                                { "data" : null,render: function ( data, type, row ) {
                                    return '<i class="fa fa-plus-circle" aria-hidden="true"></i>';
                                } },

                        ],
                        "order": [[1, 'asc']]

                    } )
                    
                })
                } );

这是整个 jQuery 代码，但我认为我需要在这部分实现 django 视图的 url：

                            { "data" : null, render: function ( data, type, row ) {
                                return '<button class="btn-view" type="button">Edit</button>';
                            } },
                            { "data" : null,render: function ( data, type, row ) {
                                return '<i class="fa fa-plus-circle" aria-hidden="true"></i>';
                            } },

我希望我的问题是可以理解和清楚的，非常感谢您的时间！

标签： jquerydjangodatatables

解决方案

在我看来，一个快速的解决方案。您可以将您的 url 定义为变量：

var url = "{% url 'feedback:useredit' -999 %}";

你可以用你的disered id替换 - 999：

var desired_url = url.replace("-999", "1");
// or
var href_title = "<a href='" + "{% url 'feedback:useredit' -999 %}".replace("-999", data.id) +"'>" + data.text + "</a>";

当然最好在您的后端方法（视图）中生成它。

from django.http import JsonResponse

def datatable_json(request):
    ... Your code here ...
    data["useredit_url"] = reverse("feedback:useredit", args=[user.id])
    return JsonResponse(data)

推荐阅读