【超详细Django网站开发过程6】便利店管理系统之——将界面返回的字符串用html网页来展示

我们发现,浏览器返回的顾客信息表单实在是太难看了,如何把这些字符串用html网页来展示呢?

方法一:Python代码直接拼接出html内容

一、定义html模板

html_mode = '''
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style>
table {
    border-collapse: collapse;
}
th, td {
    padding: 8px;
    text-align: left;
    border-bottom: 1px solid #ddd;
}
</style>
</head>
    <body>
        <table>
        <tr>
        <th>id</th>
        <th>姓名</th>
        <th>电话号码</th>
        <th>地址</th>
        </tr>

        %s   #这里是动态填入的信息


        </table>
    </body>
</html>
'''

二、将要显示的内容插入模板

    # 生成模板中要插入的内容
    tableContent = ''
    for customer in qs:
        tableContent += '<tr>'

        for name, value in customer.items():
            tableContent += f'<td>{value}</td>'

        tableContent += '</tr>'

    return HttpResponse(html_mode % tableContent)

三、查看效果
1、启动服务器:python manage.py runserver 0.0.0.0:80
2、浏览器发送请求:http://127.0.0.1/sales/customers/
效果如下:
在这里插入图片描述
当然,要是想要界面显示更好看,可以尝试css+js调整网页。

方法二:使用Django的模板引擎

Django框架提供了一种模板技术, 可以在html 中嵌入编程语言代码片段, 用模板引擎(一个专门处理HTML模板的库)来动态的生成HTML代码。

html_template = '''
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style>
table {
    border-collapse: collapse;
}
th, td {
    padding: 8px;
    text-align: left;
    border-bottom: 1px solid #ddd;
}
</style>
</head>
<body>
    <table>
    <tr>
    <th>id</th>
    <th>姓名</th>
    <th>电话号码</th>
    <th>地址</th>
    </tr>
    {% for customer in customers %}
        <tr>
        {% for name, value in customer.items %}            
            <td>{{ value }}</td>            
        {% endfor %}
        </tr>
    {% endfor %}
    </table>
</body>
</html>
'''

django_engine = engines['django']
template = django_engine.from_string(html_template)

def listcustomers(request):
    # 返回一个 QuerySet 对象 ,包含所有的表记录
    qs = Customer.objects.values()

    # 检查url中是否有参数phonenumber
    ph = request.GET.get('phonenumber', None)

    # 如果有,添加过滤条件
    if ph:
        qs = qs.filter(phonenumber=ph)

    # 传入渲染模板需要的参数
    rendered = template.render({'customers': qs})
    return HttpResponse(rendered)

小结:
使用模板引擎可以直接把要生成的 HTML片段写在 HTML模板 里面,我们只需传入渲染模板所需要的参数就可以了,模板引擎会自动帮我们生成的HTML。

猜你喜欢

转载自blog.csdn.net/yljwhat/article/details/107826043