Django ajax接收后端数据

前端页面查询之前

前端页面点击查询之后

前端代码,目的是查询的多条数据填充到tbody标签内

<button class="btn btn-success" id="bt_pod">查询pod</button>
      <span style="color: red" >{{ msglist }}</span>
<button class="btn btn-success" id="bt_service">查询service</button>
      <span style="color: red" >{{ msglist }}</span>
<div class="table-responsive" id="pod_div" style="display:none;">
      <table id="basicExampl" class="table no-margin">
      <thead>
      <tr>
      <th>名称</th>
      <th>命名空间</th>
      <th>状态</th>
      <th>Podip</th>
      <th>主机节点</th>
      <th>重启次数</th>
      <th>启动时间</th>
      </tr>
      </thead>
      <tbody id="pod_tbody">
      </tbody>
      </table>
</div>

<script type="text/javascript">
    jQuery(function($) {
        $("#bt_pod").click(function(){
            $("#pod_div").show();
            $("#service_div").hide();
            $.ajax({
                url:"/yw/k8s_list/",
                traditional:true,
                type:"POST",
                success:function (data) {
                    $('#pod_tbody').empty();   //清空标签内数据
                    $(data).each(function (i, v) {  //添加标签内新的数据
                        $('#pod_tbody').append('<tr><td style="width:230px">' + v[0] + '</td>' +
                            '<td style="width:190px">' + v[1] + '</td>' +
                            '<td style="width:190px">' + v[2] + '</td>' +
                            '<td style="width:190px">' + v[3] + '</td>' +
                            '<td style="width:190px">' + v[4] + '</td>' +
                            '<td style="width:190px">' + v[5] + '</td>' +
                            '<td style="width:190px">' + v[6] + '</td></tr>');
                    });
                },
                error: function(XMLHttpRequest, textStatus, errorThrown)
                {alert('查询失败');}
            });
        });
})
</script>

后端代码:

    def post(self, request):
        nick = request.session.get('nick')
        if request.session.get('k_login', None):
            k8s_url = request.session['k8surl']
            k8s_url = 'https://' + k8s_url
            # ktitle = '已登录' + k8s_url
            k8s_token = request.session['k8stoken']
            configuration = client.Configuration()
            configuration.host = k8s_url
            configuration.verify_ssl = False
            configuration.api_key = {"authorization": "Bearer " + k8s_token}
            client1 = api_client.ApiClient(configuration=configuration)
            api = core_v1_api.CoreV1Api(client1)
            ret = api.list_pod_for_all_namespaces(watch=False)
            # ret是object类型,所以需要转换
            data = []
            x = 0
            for i in ret.items:
                data.append([])
                data[x].append(i.metadata.name)
                data[x].append(i.metadata.namespace)
                data[x].append(i.status.phase )
                data[x].append(i.status.pod_ip)
                data[x].append(i.status.host_ip)
                data[x].append(i.status.container_statuses[0].restart_count)
                data[x].append(i.status.conditions[0].last_transition_time)
                x += 1
            # return HttpResponse(json.dumps({'nick': nick, 'ktitle': ktitle}))
            return JsonResponse(data,safe=False)

如果是查询数据库更简单,不用转换数据了,直接json到前端

评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值