当我们做动态页面时,我们会发现一个网站的头部和尾部是相同的,那么我们如何用tp框架来做模板呢 ?

先看一下注意事项:

(1)每个区块由<block></block>标签组成

(2)子模板中使用extend标签继承模板

(3)注释语法:{/* 注释内容 */ } 或 {// 注释内容 } 

一、看一下基本的模板继承

(1)先做出模板页面  Ceshi/View/Main/base.html

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<!--放标题-->
<title><block name="bt">标题</block></title>
<style>
*{padding: 0px;margin: 0px;}
#head{width: 100%;height: 100px;background-color: azure;}
#foot{width: 100%;height: 100px;background-color: gray;}
</style>
<!--用于放js、css样式-->
<block name="tou"></block>
</head>
<body>
<div id="head">
<h1>这是头部</h1>
<!--从数据库读取数据-->
<foreach name="arr" item="vo" >
<span>{$vo.name}</span>
</foreach>
</div>
<!--这是需要依据页面变化的内容-->
<block name="nr"></block> <div id="foot">
<h1>这是尾部</h1>
</div>
</body>
</html>

  (2)做操作方法Ceshi/Controller/MainController.class.php

<?php
namespace Ceshi\Controller;
use Think\Controller;
class MainController extends Controller
{ //模板的继承
public function test(){
//这样可以调用模板中连接数据库部分
$this->base();
$this->show();
}

//当模板页面链接数据库时
public function base(){
$m=M("users");
$arr = $m->select();
$this->assign("arr",$arr);
} }

  (3)做子页面   Ceshi/View/Main/test.html

<!--调用模板-->
<extend name="base" /> <block name="bt">子页面</block>
<block name="tou">
<style type="text/css">
#nr{width: 100%;height: 400px;background-color: yellow; }
</style>
</block>
<block name="nr">
<div id="nr">
<h1>我是中间内容</h1>
</div>
</block>

  效果图(样式有点简单)

注意事项:当模板页面有链接数据库的数据时怎样做

(二)举例:删除和修改

(1)先做显示页面    Ceshi/View/Main/mains.html

<extend name="base" />
<block name="bt">shanchu</block>
<block name="tou">
<style type="text/css">
/*#nr{width: 100%;height: 400px;background-color: yellow; }*/
#aa{height: 400px;width: 100%;background-color: yellow;}
</style>
</block>
<block name="nr">
<div id="aa">
<table width="100%" border="1" cellpadding="0" cellspacing="0">
<tr>
<td>代号</td>
<td>书名</td>
<td>单价</td>
<td>库存</td>
<td>时间</td>
<td>操作</td>
</tr> <!--name表示数组名称 item表示遍历出来的每一个小数组-->
<foreach name="attr" item="v" >
<tr>
<td>{$v.bkid}</td>
<td>{$v.bkname}</td>
<td>{$v.bkprice}</td>
<td>{$v.bkstock}</td>
<td>{$v.time}</td>
<!--用get方式传值-->
<td><a href="__CONTROLLER__/del/bkid/{$v.bkid}">删除</a>
<a href="__CONTROLLER__/update/bkid/{$v.bkid}">修改</a></td>
</tr>
</foreach> </table>
</div>
</block>

  

(2)做操作方法Ceshi/Controller/MainController.class.php

<?php
namespace Ceshi\Controller;
use Think\Controller;
class MainController extends Controller
{ public function mains(){
$m = M("book");
$arr = $m->select();
$this->assign("attr",$arr);
$this->show();
} public function del($bkid){
//$bkid 以形参的方式传值
$m = M("book");
$url = U("mains");
if($m->delete($bkid)){
//第二个参数,表示返回的路径;第三个参数:表示停留时间
$this->success("删除成功",$url);
} else{
//不写第二个参数,默认返回上一个页面
$this->error("删除失败");
}
} public function update(){ $m = M("book");
//get方式取到值
$bkid = $_GET["bkid"];
$attr = $m->find($bkid);
//注册变量
$this->assign("attr",$attr); if(empty($_POST)){ $this->show(); }else{
//自动获取表单数据
$m->create();
$m->save(); }
} }

  (3)修改页面 Ceshi/View/Main/update.html

<extend name="base" />
<block name="bt">修改</block>
<block name="tou">
<style type="text/css">
#nr{width: 100%;height: 400px;background-color: yellow;}
</style>
</block>
<block name="nr">
<form method="post" action="__ACTION__">
<input type="hidden" name="bkid" value="{$attr.bkid}" /><br />
书名:<input type="text" name="bkname" value="{$attr.bkname}" /><br />
单价:<input type="text" name="bkprice" value="{$attr.bkprice}"/><br />
库存:<input type="text" name="bkstock" value="{$attr.bkstock}"/><br />
<input type="submit" value="修改"/>
</form>
</block>

  看一下效果:

点击删除bkid=33;

原页面bkid=33已经被删除

点击修改bkid=22;

点击修改提交数据,重新刷新页面,会发现单价和粗存已经被修改了

这样,tp框架的删除和修改就完成了,至于用ajax方式还是tp框架方式写,哪个更方便就用哪个呗~~~

tp框架---View视图层---模板继承(举例说明)的更多相关文章

  1. laravel5.1框架基础之Blade模板继承简单使用方法分析

    本文实例讲述了laravel5.1框架基础之Blade模板继承简单使用方法.分享给大家供大家参考,具体如下: 模板继承什么用? 自然是增强基础页面的复用,有利于页面文档的条理,也便于更改多处使用的内容 ...

  2. TP框架---Model模型层---做模型对象

    TP框架----Model模型层---------------做模型对象 Model模型层是用来做什么的呢???? 主要是用来做操作数据库访问的. 也就说明TP框架自带了一种访问数据库的方式,使用的是 ...

  3. Django 的路由层 视图层 模板层

    --------------------------------------------------------------通过苦难,走向欢乐.——贝多芬 Django-2的路由层(URLconf) ...

  4. 3.Django| 视图层| 模板层

    1.视图函数 文件在view_demo 一个视图函数简称视图,是一个简单的Python 函数,它接受Web请求并且返回Web响应.响应可以是一张网页的HTML内容,一个重定向,一个404错误,一个XM ...

  5. Django:(2)视图层&模板层

    视图函数 一个视图函数,简称视图,是一个简单的Python 函数,它接受Web请求并且返回Web响应.响应可以是一张网页的HTML内容,一个重定向,一个404错误,一个XML文档,或者一张图片. . ...

  6. Tp框架之模型层

    数据模型层是专门针对数据库来操作的 我们在home模块用一下数据模型层 先把配置修改好 我们先来打开这个文件 然后再打开think里面的主配置,把那里面关于数据库的部分,复制到home下的配置文件,然 ...

  7. tp框架-----Model模型层

    1.Model模型层是用来做什么的呢? 主要是用来做操作数据库访问的.也就说明TP框架自带了一种访问数据库的方式,使用的是Model模型. 2.Model模型怎样使用呢? 要使用Model模型层访问数 ...

  8. 4 Template层 -模板继承

    1.模板继承 模板继承可以减少页面内容的重复定义,实现页面内容的重用 典型应用:网站的头部.尾部是一样的,这些内容可以定义在父模板中,子模板不需要重复定义 block标签:在父模板中预留区域,在子模板 ...

  9. Jeecms6中后台控制层Action如何将值传入前台视图层模板中的?

    转载:https://blog.csdn.net/wsm201005030226/article/details/44343069     Jeecms后台控制层如何传值到前台freemarker的? ...

随机推荐

  1. 关于Python编码,超诡异的,我也是醉了

    Python的编码问题,真是让人醉了.最近碰到的问题还真不少.比如中文文件名.csv .python对外呈现不一致啊,感觉好不公平. 没图说个JB,下面立马上图.   我早些时候的其他脚本,csv都是 ...

  2. Lambda类库篇 —— Streams API, Collector和并行

    本文是深入理解Java 8 Lambda系列的第二篇,主要介绍Java 8针对新增语言特性而新增的类库(例如Streams API.Collectors和并行). 本文是对 Brian Goetz 的 ...

  3. Running R jobs quickly on many machines(转)

    As we demonstrated in “A gentle introduction to parallel computing in R” one of the great things abo ...

  4. 《NLTK基础教程》译者序

    购买<NLTK基础教程> 说来也凑巧,在我签下这本书的翻译合同时,这个世界好像还不知道AlphaGo的存在.而在我完成这本书的翻译之时,Master已经对人类顶级高手连胜60局了.至少从媒 ...

  5. java中的各种流(老师的有道云笔记)

    内存操作流-字节 之前的文件操作流是以文件的输入输出为主的,当输出的位置变成了内存,那么就称为内存操作流.此时得使用内存流完成内存的输入和输出操作. 如果程序运行过程中要产生一些临时文件,可采用虚拟文 ...

  6. 泛型(java菜鸟的课堂笔记)

                1. 泛型的简单运 用和意义   2. 泛型的上限与下限   3. 泛型和 子类继承的限制   4. 泛型类和泛型 方法   5. 泛型嵌套和泛型擦除             ...

  7. html表格表单标签的结合

    今天我尝试将表格表单基本标签结合起来放在网页中,发现再没用表单元素中<form></form>时各类标签功能都可显示,只是不能提交网页,所有与提交网页的标签都不能使用提交功能, ...

  8. html、css和js注释的规范用法

    成为专业的前端工程师!!! html注释: <!--注释内容--> css注释: //注释内容 单行注释(不推荐使用,因为有的浏览器可能不兼容,没有效果)/*注释内容*/ 多行注释(推荐使 ...

  9. [python标准库]XML模块

    1.什么是XML XML是可扩展标记语言(Extensible Markup Language)的缩写,其中的 标记(markup)是关键部分.您可以创建内容,然后使用限定标记标记它,从而使每个单词. ...

  10. .Net Core 图片文件上传下载

    当下.Net Core项目可是如雨后春笋一般发展起来,作为.Net大军中的一员,我热忱地拥抱了.Net Core并且积极使用其进行业务的开发,我们先介绍下.Net Core项目下实现文件上传下载接口. ...