Django学习之-后端数据展示在前端

2022-02-21 22:33:10 阅读：173 来源： 互联网

标签：exception 后端 border 前端 Django result data id plan

先看前端代码

{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <style type="text/css">
        td,th {
            text-align: center;
            border:1px solid black;
            }
        table {
            margin-left:100px;
            margin-top:50px;
            border:1px solid black;
            border-collapse:collapse;
            }
        .align_center{
            text-align: center;
            }
    </style>
    <title>推置引擎测试界面</title>
    <script src="http://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script>
</head>
<body>
   <table width="800" >
      <caption>
        <h1>推置引擎测试界面</h1>
      </caption>
       <tr>
        <td>异常id</td>
        <td><input type="text" id="exception_id" class="text"></td>
        <td>方案id</td>
        <td><input type="text" id="plan_id" class="text"></td>
      </tr>
       <tr>
        <td colspan="4"></td>
       </tr>
       <tr>
        <td colspan="2">规则</td>
        <td>操作</td>
        <td>测试结果</td>
       </tr>
       <tr>
        <td colspan="2">testcase1:测试用例1说明</td>
        <td><input type="button" name="button1" value="测试" onclick="calculate_test1()"/></td>
        <td><span id="result1" class="align_center"></span></td>
       </tr>       
   </table>
    <script>
      function calculate_test1() {
         var exception_id = $("#exception_id").val()
         var plan_id = $("#plan_id").val()
         $.ajax({
            url: '/calculate_test1pro/',
            data: {'exception_id':exception_id,'plan_id':plan_id},
            type: 'POST',
            dataType: 'json',
            success: function (data) {
                console.log(data)
                document.getElementById("result1").innerText = data.result
                }
            })
            }
    </script>
</body>
</html>

后端代码

from django.shortcuts import HttpResponse
from django.http import JsonResponse

# Create your views here.
def test1pro(request):
    result = "PASS"
    response = JsonResponse({"status": '服务器接收成功', 'result': result})
    return response

说明：

标签：exception,后端,border,前端,Django,result,data,id,plan
来源： https://www.cnblogs.com/like1824/p/15921043.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

Django学习之-后端数据展示在前端