• TP框架---View视图层---模板继承(举例说明)


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

    先看一下注意事项:

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

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

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

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

    (1)先做出模板页面 Home/View/Index/base.html

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title><block name="title">无标题文档</block></title>
    <style type="text/css">
    #head{100%;height:100px;background-color:red}
    #footer{width100%;height:50px;background-color:blue}
    </style>
    <block name="tou">
    
    </block>
    </head>
    
    <body>
    
    <div id="head">
    	<h1>这是头部</h1>
    </div>
    
    <block name="nr"></block>
    
    <div id="footer">
    	<h1>这是尾部</h1>
    </div>
    </body>
    </html>
    

    (2)做操作方法Home/Controller/IndexController.class.php

    <?php
    namespace HomeController;
    use ThinkController;
    class IndexController extends Controller {
    
    	public function test(){
    		$this->show();
    	}
    	public function base(){
    		$n=M("title");
    		$arr=$n->select();
    		$this->assign("arr",$arr);
    		$this->show();
    	}
    }
    

    (3)做子页面  Home/View/Index/test.html  

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

    效果图(样式有点简单)

      

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

    (二)举例:删除和修改

    (1)先做显示页面   Home/View/Index/mains.html

     

    <extend name="base" />
    <block name="tou">
    	<style type="text/css">
    	#nr{100%;height:430px;background-color:yellow}
    	</style>
    </block>
    <block name="nr">
    <div id="nr">
    	<table width="100%" border="1">
    		<tr>
    			<td>代号</td>
    			<td>名称</td>
    			<td>系列</td>
    			<td>油耗</td>
    			<td>价格</td>
    			<td>操作</td>
    		</tr>
    		<foreach name="arr" item="v" >
    			<tr>
    				<td>{$v.code}</td>
    				<td>{$v.name}</td>
    				<td>{$v.brand}</td>
    				<td>{$v.oil}</td>
    				<td>{$v.price}</td>
    				<td><a href="__CONTROLLER__/del/code/{$v.code}" />删除
    				<a href="__CONTROLLER__/upd/code/{$v.code}" />修改
    				</td>
    		    </tr>
    	    </foreach>
    		
    	</table>
    </div>	
    </block>
    

     (2)做操作方法 Home/Controller/IndexController.class.php

     

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

     (3)修改页面 Home/View/Index/update.html 

    <extend name="base" />
    <block name="tou">
        <style type="text/css">
            #nr{ 100%;height: 400px;background-color: yellow;}       
        </style>
    </block>
    <block name="nr">
    
    <form action="__ACTION__" method="post">
    	<div><input type="hidden" name="Code" value="{$attr.code}" /></div>
    	<div>名称:<input type="text" name="Name" value="{$attr.name}" /></div>
    	<div>系列:<input type="text" name="Brand" value="{$attr.brand}" /></div>
    	<div>油耗:<input type="text" name="Oil" value="{$attr.oil}" /></div>
    	<div>价格:<input type="text" name="Price" value="{$attr.price}" /></div>
    	<input type="submit" value="修改" />
    </form>
    </block>
    

     看一下效果:

     

    点击删除code=c018

    ;

    再看原来页面c018就没有了

    点击修改code=c017

    点击修改提交数据,重新刷新页面,会发现油耗和价格已经被修改了

  • 相关阅读:
    高格-远程支持中的奇怪问题【15】
    关于er图的几个工具
    如何解决win10明明是管理员还要权限的问题
    判断日期天数
    谈一谈在公司两次压测我总结的思路
    vue学习之-----v-model数据双向绑定,自定义组件父子传参
    Js各种小技巧总结
    openlayers学习之-----核心类
    openlayers学习之-----把坐标点改为WKT格式的数据
    新书介绍 -- 《Redis核心原理与实践》
  • 原文地址:https://www.cnblogs.com/douchenchen/p/7154008.html
Copyright © 2020-2023  润新知