ajax刷新表格-django

想用ajax刷新列表,筛选出某个订单号

img

def citys(request, aid, org, cust, tk):
    lst = PaidClear(aid, org, cust, tk).got_solist         #后端传过来的列表
    return JsonResponse({'data': lst})
    <script src="/static/js/jquery-3.6.0.min.js">script>
    <script>
        $(function(){
            $('#prov').click(function () {
                // 发起一个ajax请求
                pid = $('#mm').val()
                $.get('omvds/'+pid, function (data) {
                    var artTable = document.getElementById("myTable");//与表格的id对应
                    var artBody=artTable.tBodies[0];
                    artBody.parentNode.outerHTML = artBody.parentNode.outerHTML.replace(artBody.innerHTML, "");//每次递归先把上次递归的表格清除
                    var all_li = eval(data);
                    var all_list = eval(all_li.all_data);
                    var tb = document.getElementById('myTable');//与表格的id对应
                    var body = tb.querySelector('tbody');//找到对应表格的标签
                    for (let i = 0; i < all_list.length; i++) {
                    //设置表格每个单元的值
                        var fie = all_list[i].fields;
                        var tr = document.createElement('tr');
                        var td1 = document.createElement('th', scope = "col");
                        var td2 = document.createElement('td');
                        var td3 = document.createElement('td');
                        var td4 = document.createElement('td');
                        var td5 = document.createElement('td');
                        var td6 = document.createElement('td');
                        var td7 = document.createElement('td');
                        var td8 = document.createElement('td');

                        td1.innerHTML = fie.CO;
                        td2.innerHTML = fie.SO;       // 这里怎么加一个input?
                        td3.innerHTML = fie.PD;
                        td4.innerHTML = fie.SQ;
                        td5.innerHTML = fie.CU;
                        td6.innerHTML = fie.SM;
                        td7.innerHTML = fie.PS;
                        td8.innerHTML = fie.QT;

                        //设置完成后,将每一项插入到表格中
                        tr.append(td1);       
                        tr.append(td2);
                        tr.append(td3);
                        tr.append(td4);
                        tr.append(td5);
                        tr.append(td6);
                        tr.append(td7);
                        tr.append(td8);
                                       // 这里怎么插一列checkbox?
                        body.append(tr);}
                })
            })
        })
    script>

{% endblock %}

{% block main %}
    <input type="text" name="find" id="mm">
    <button id="prov">筛选订单号button>
            <table border="1" cellspacing="0" id="myTable">
            {% if pmt %}
                <tr>
                    <th style="width: 80px; font-size: 10px;">公司th>
                    <th style="width: 100px; font-size: 10px;">销售订单号th>
                    <th style="width: 100px; font-size: 10px;">订单日期th>
                    <th style="width: 100px; font-size: 10px;">已发货数量th>
                    <th style="width: 230px; font-size: 10px;">客户th>
                    <th style="width: 90px; font-size: 10px;">订单金额th>
                    <th style="width: 90px; font-size: 10px;">业务员th>
                    <th style="width: 90px; font-size: 10px;">订单数量th>
                    <th style="width: 230px; font-size: 10px;">最终客户th>
                    <th style="width: 90px; font-size: 10px;">已核销th>
                    <th style="width: 90px; font-size: 10px;">剩余可核销th>
                    <th style="width: 60px; font-size: 10px;">选择th>
                    <th style="width: 60px; font-size: 10px;">是否关闭th>
                tr>
            {% endif %}
        <form action="{% url 'Hm:getmnys' aid org cust %}" method="post">
        {% csrf_token %}

        {% for user in pmt %}
            <tbody>
                <tr class="to_sum" style="height: 30px; font-size: smaller">
                    <td>{{ user.0 }}td>
                    <td><input hidden type="text" name="notpo" class="cpo" value="{{ user.1 }}" >{{ user.1 }}td>   
                    <td style="text-align: right">{{ user.2 }}td>
                    <td style="text-align: right">{{ user.3|floatformat:2 }}td>
                    <td>{{ user.4 }}td>
                    <td style="text-align: right">{{ user.5|floatformat:2 }}td>
                    <td style="text-align: center">{{ user.6 }}td>
                    <td style="text-align: right">{{ user.7 }}td>
                    <td>{{ user.8 }}td>
                    <td style="text-align: right">{{ user.9|floatformat:2 }}td>
                    <td>
                        <input style="color: yellow; background-color: darkslateblue; text-align: right; width: 90px; " type="text" name="notme" class="killme" value="{{ user.10|floatformat:2 }}" >
                    td>
                    <td><input type="checkbox" name="ckbox" class="box_ck" onclick="calculate()">td>
                    <td style="text-align: center"><a href="{% url 'Hm:close_so' aid=aid org=user.0 cust=cust so=user.1 %}"><h7 style="color:yellow;">关闭h7>a>td>
                tr>
            tbody>
        {% endfor %}
        <input type="submit" value="提 交">
        form>
        table>

    function test(data) {
        var artTable = $('#myTable');//与表格的id对应
        var artBody = $('tbody', artTable);
        artBody.empty()
        var all_li = eval(data);
        var all_list = [{fields: {SO: '1', PD: '2'}}];
        for (let i = 0; i < all_list.length; i++) {
            var fie = all_list[i].fields;
            let tr = $('<tr>');
            $('<td>').text(fie.CO).appendTo(tr)
            $('<td>').append($('<input>')).appendTo(tr)
            $('<td>').text(fie.SO).appendTo(tr)
            $('<td>').text(fie.PD).appendTo(tr)
            $('<td>').text(fie.SQ).appendTo(tr)
            $('<td>').text(fie.CU).appendTo(tr)
            $('<td>').text(fie.SM).appendTo(tr)
            $('<td>').text(fie.PS).appendTo(tr)
            $('<td>').text(fie.QT).appendTo(tr)
            $('<td>').append($('<input>').attr('type', 'checkbox').click(function () {
                calculate()
            })).appendTo(tr)
            tr.appendTo($(artBody))
        }
    }

img

img