写在前面的话:应客户需求需要给后台增加自助添加电影名称和链接的功能,添加后在微信前台能自动读取显示。
开发步骤:
1、由于是给后台添加一个增加电影及电影链接的功能,所以控制器在Admin下。
在路径 Application\Lib\Action\Admin 下新建控制器 MvaddAction.class.php
控制器全部代码如下:
<?php //继承PublicAction后访问本页面时必须先登录后台 class MvaddAction extends PublicAction { public function index() { $result = M("movie")->select(); //var_dump($result);exit; $this->assign("name",$result); $this->display (); } public function add() { $data["mvname"] = $_POST["name"]; $data["mvlink"] = $_POST["mvlink"]; $result = M("movie")->add($data); if($result){ $this->ajaxReturn($result,"新增成功!",1); //echo "ok"; } } public function del(){ $id = $_POST['id']; $result = M("movie")->where(array("id"=>$id))->delete(); if($result){ $this->ajaxReturn($result,"删除成功!",1); } } public function show(){ $id = $_GET['id']; $link = M("movie")->where(array("id"=>$id))->find(); $this->assign("link",$link['mvlink']); $this->display(); } }
2、添加模板
在 Application\Tpl\Admin\Mvadd 目录下添加静态页面模板 index.html
静态页面为已经全部开发完成的页面。
前端框架采用bootstrap
<!DOCTYPE HTML> <html lang="zh-CN"> <head> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> <link href="//cdn.bootcss.com/bootstrap/4.0.0-alpha.4/css/bootstrap.css" rel="stylesheet"> </head> <script src="http://code.jquery.com/jquery-1.4.1.min.js"></script> <body> <form role="form" action="#"> <div class="form-group"> <label for="exampleInputEmail1">电影名称</label> <input type="text" class="form-control" id="mvname" placeholder="请输入电影名称 如:精品电影"> </div> <div class="form-group" > <label for="exampleInputPassword1">电影链接</label> <input type="text" class="form-control" id="mvlink" placeholder="电影链接:如 http://www.029gc.cn"> </div> <button type="button" id="add" class="btn btn-primary btn-lg btn-block" style="width:20%;align:center;">保存</button> </form> <table class="table table-bordered"> <tr id="tr"><td>名称</td><td>链接</td><td>操作</td></tr> <foreach name="name" item="vo"> <tr id="{$vo.id}tr"><td>{$vo.mvname}</td><td>{$vo.mvlink}</td><td><a href="javascript:void(0)" οnclick=dellink({$vo.id});>删除</a></td></tr> </foreach> </table> </body> <SCRIPT type=text/javascript> $("#add").click(function (){ var name = $("#mvname").val(); var link = $("#mvlink").val(); if(name==""||link==""){ alert("电影名称或链接不能为空"); return; }else{ $.ajax({ url: "../index.php?g=Admin&m=Mvadd&a=add", type: "POST", data:{"name":name,"mvlink":link}, dataType: "json", error: function(){ alert('Error loading XML document'); }, success: function(data){ alert(data.info); $("#tr").after("<tr id="+data.data+"tr><td>"+name+"</td><td>"+link+"</td><td><a href='javascript:void(0)' οnclick=dellink1("+data.data+");>删除</a></td></tr>") } }); } }); function dellink(id){ $.ajax({ url: "../index.php?g=Admin&m=Mvadd&a=del", type: "POST", data:{"id":id}, dataType: "json", error: function(){ alert('Error loading XML document'); }, success: function(data){ alert(data.info); $("#"+id+"tr").remove(); } }); } </SCRIPT> </html>
技术点:
动态增加和删除表格中的数据。