pycharm中做web应用(7)基于Django 做交互界面3
前文我们已经实现了前端数据在服务器端的打印输出功能,可是,在前端,用户提交数据后,是否成功用户并没有得到确认信息,如何才能在前端页面上实时显示用户输入的信息昵?下面介绍实现方法:
预备知识–模板语法:
模板是在 HTML 结构的基础上,把上面要显示的内容的关键部分用这种双大括号的特定的语法替换掉,在进行模板编译的时候,再动态根据实际内容来替换这些模板部分,以实现动态网站。比如:HTML 文件中有:
<div id="username">用户名</div>
但是这样的话,每次打开这个 HTML,这里都显示的是“用户名”三个字。如果希望在这里显示当前登录的用户名。那么,我通过其他编程语言,将用户名存在一个变量里面,比如就是 name,那么我就将 HTML 改写成这样:
<div id="username">{{ name}}</div>
这样以后只要将用户名动态存入 name变量,就可以得到不同的显示结果了。
template模板html引入变量支持动态显示
在Django的框架中,templates包含了所有的html文件,我们在index.html中引入变量fnane:
Welcome {{ fname }} from beijing
用于动态显示提交的用户姓名信息,该姓名信息将从view.py中获取到,并以参数的方式传递给templates中的index.html。
从view.py传值到html变量
在view.py中,通过前文,我们知道可以从request对象中,获取表单的各个项目信息,此处以获取用户姓名为例,实现代码如下:
name = request.POST.get("fname")
objname ={'fname':name}
return render(request,'index.html',objname)
这样,通过render的参数3,templates的index.html获取了fname参数的值,实现了动态显示用户姓名的目的。
实际测试
第一次运行,由于fname没有初始化,所以值为None,显示界面如下:
输入用户名和公司名称,提交前:
然后提交,页面显示为:
至此,在前文基础上,我们实现了交互式界面提交数据的前端显示功能。