案例:广告的增删改查

步骤:

1引用 js

2 填写 input type=" file" 的id

3 填写 url

4后台保存地址

5前台成功后的处理

广告添加页

<div class="modal-header no-padding">
<div class="table-header">
<i class="icon-lock"></i>
<button type="button" class="close" data-dismiss="modal">×</button>
添加广告
</div>
</div> <div class="modal-body overflow-visible">
<label class="control-label pull-left" style="padding-right:20px;">类别</label>
<select id="class_id" name="class_id" class="left">
<option value="">不限</option>
<volist name="advertise_class" id="vo">
<eq name="vo.id" value="$map.class_id">
<option value="{$vo.id}" selected >{$vo.name}</option>
<else />
<option value="{$vo.id}" >{$vo.name}</option>
</eq>
</volist>
</select>
</div> <div class="modal-body overflow-visible">
<div class="control-group">
<label class="control-label" for="name">广告名称</label>
<div class="controls">
<input type="text" required="required" id="name" name="name" placeholder="广告名称"/>
</div>
</div> <div class="control-group">
<label class="control-label" for="url">广告地址</label>
<div class="controls">
<input type="text" required="required" id="url" name="url"
placeholder="注意添加http://"/>
</div>
</div>
<div class="control-group">
<label class="control-label" for="Pic" >广告图片</label>
<div class="controls">
<input type="file" name="Pic" id="Pic" style="display: none" onchange="uploadFile();" />
<label for="Pic">
<img id="image" class="image" width="15%" height="15%" style="width: auto; height:80px;" src="__PUBLIC__/HomeStyle/images/photo.png" >
</label>
<!--<input type="file" id="image" style="display: none" onchange="uploadFile('{:U('Admin/Advertisement/image')}', 'imageCom','logo_success');" />-->
<!--<label for="image">-->
<!--<img class="logo_success" width="13%" height="13%" src="__PUBLIC__/HomeStyle/images/photo.png" >-->
<!--</label>--> <!--<input id="file0" type="file" size="10" accept="image/*" placeholder="点击上传" onchange="uploadFile('{:U('Admin/Advertisement/image')}', 'file0','advertise_pic');" />-->
<!--  <!–用for属性绑定file控件–>   -->
<!--  <label for="file0">        -->
<!--<img id="pic" class="advertise_pic" width="13%" height="13%" src="__PUBLIC__/HomeStyle/images/photo.png" alt=" " />  -->
<!--  </label>   -->
</div>
</div> <div class="control-group">
<label class="control-label" for="sort">排序</label>
<div class="controls">
<input type="text" required="required" id="sort" name="sort"
placeholder="数字越大越靠前"/>
</div>
</div> <div class="control-group">
<label class="control-label" for="note">备注</label>
<div class="controls" >
<textarea type="text" style="height: 50px" cols="20" rows="10" required="required" id="note" name="note" />
</div>
</div>
</div> <div class="modal-footer">
<button data-dismiss="modal" class="btn btn-small">
<i class="icon-remove"></i>
取消
</button>
<button type="button" class="btn btn-small btn-primary" onclick="$.doAdd('{:U('Admin/Advertisement/doAdd')}', this);">
<i class="icon-ok"></i>确认
</button>
</div>
<input id="pic_hidden" value="">
<script src="__PUBLIC__/HomeStyle/js/ajaxfileupload.js"></script>
<script type="text/javascript">
//图片上传
function uploadFile() {
$.ajaxFileUpload({
url: "{:U('Admin/Advertisement/upload')}", //请求控制器地址
secureuri: false,
fileElementId: 'Pic', //input type=“file”标签的id
dataType: 'json', //返回值类型
success: function (data) //服务器成功响应处理函数
{
if (data.code ==1) {
$('#pic_hidden').val(data.msg);
data.msg = data.msg + '?' + parseInt(Math.random() * 1000); //添加随机数
$('.image').attr('src', data.msg);
} else {
alert(data.msg);
}
},
})
} jQuery(function($){
$.extend({
doAdd : function(url, obj)
{
var obj = $(obj).parents('form'); $.ajax({
url : url,
type : 'get',
data : {
class_id:$('#class_id').val(),
name:$('#name').val(),
url:$('#url').val(),
pic:$('#pic_hidden').val(),
sort:$('#sort').val(),
note:$('#note').val()
},
success : function(res)
{
$.lagou.alert(res.msg, res.code, 2);
$.lagou.formHide();
location.reload();
}
});
}
});
}); </script>

  

后台:

<?php
/**广告管理
* Created by PhpStorm.
* User: Administrator
* Date: 2017/5/3
* Time: 17:33
*/ namespace Admin\Controller; class AdvertisementController extends BaseController { protected $AdvertisementObj = null;
protected $Advertise_class=null; public function __construct()
{
parent::__construct();
$this->AdvertisementObj = M('Advertisement');
$this->Advertise_class=M('Advertise_class');
} /**
*
*/
public function index()
{
//获取页面中所有name标签的内容
$map=I();
//移除$map中所有可以转为false的值,如:false,0,‘0’,arrary(),null,'',
// $a=array_filter($map);
$a=$map;
//名称
if(!empty($a['name'])){
$where['am.name']=array('LIKE','%'.$a['name'].'%'); //联表查询有两个name时,搜索条件要带表名。
}
//审核状态
//empty 若变量已存在、非空字符串或者非零,则返回 false 值;反之返回 true。
//换句话说,""、0、"0"、NULL、FALSE、array()、var $var; 以及没有任何属性的对象都将被认为是空的,如果 var 为空,则返回 TRUE。
//if 0代表假 非0代表真
if($a['state']!=""){
$where['state']=array('EQ',$a['state']);
}
//类别
if(!empty($a['class_id'])){
$where['class_id']=array('EQ',$a['class_id']);
}
//var_dump($where);
//分页
$total=$this->AdvertisementObj->where($where)->count();//获取总页数
$Page= new \Think\Pages($total,10);//显示10个页码
$Page->setConfig('first','首页');
$Page->setConfig('prev','上一页');
$Page->setConfig('next','下一页');
$Page->setConfig('last','尾页');
$showPage = $Page->show();
//搜索结果
// $data=$this-> companyModel->where($where)->page(I('get.p',1),20)->order('create_time desc')->join('as com left join lg_city_category as city on com.city=city.id left join lg_trade as tr on com.trade=tr.id left join lg_basic_config_category as bc on com.stage=bc.id')->field('com.id as id,com.name as name,com.trade,city.name as city,tr.name as trade,bc.name as stage,com.state as state')-> select();
$data=$this->AdvertisementObj->where($where)->page(I('get.p',1),10)->order('sort desc')->join('as am left join lg_advertise_class as ac on am.class_id=ac.id')->field('am.id,am.name,am.create_time,am.sort,am.state,ac.name as class_name') ->select();//get.p 表示页码,如果不存在则赋值1,每页20行。
//var_dump($data);
$advertise_category=$this->Advertise_class->order('sort desc')->select();
//上一次搜索条件
$this->assign('map',$a);
$this->assign('advertise_class',$advertise_category);
//分页
$this->assign('page',$showPage);
//列表
$this->assign('data', $data);
$this->display(); } /**
* 添加
*/
public function add()
{
$advertise_category=$this->Advertise_class->order('sort desc')->select();
$this->assign('advertise_class',$advertise_category);
$this->display();
} /**
* 执行添加
*/
public function doAdd()
{
$data=I();
$data['create_time'] = time();
$data['state'] = 1;
$rs = $this->AdvertisementObj->add($data);
if($rs){
$msg['code'] = 1;
$msg['msg'] = '添加成功';
}else{
$msg['code'] = 0;
$msg['msg'] = '添加失败';
}
$this->ajaxReturn($msg);
} //图片处理
public function upload()
{
$upload = new \Think\Upload();// 实例化上传类
$upload->maxSize = 3145728 ;// 设置附件上传大小
$upload->exts = array('jpg', 'gif', 'png', 'jpeg');// 设置附件上传类型
$upload->savePath = './Advertisement/Pic/'; // 设置图片上传目录,默认在 Uploads文件下。
$upload->saveName = time().'_'.mt_rand(); //生成随机名称,如果想实现替换可以定位用户id: (string)session('user.id');
$upload->saveExt = 'jpeg';
$upload->subName = "";
$upload->replace = true;
$upload->hash = false;
$info = $upload->upload();
if(!$info){
$msg['code']=0;
$msg['msg']=$upload->getError();
}else{
$msg['code']=1;
$msg['msg']= '/Uploads/Advertisement/Pic/'.$info['Pic']['savename']; //想前台返回地址和新名称
}
$this->ajaxReturn($msg);
}
/**
* 修改
*/
public function edit()
{
$id = I('get.id');
$info = $this->AdvertisementObj->where('id='.$id)->find();
$advertise_category=$this->Advertise_class->order('sort desc')->select();
$this->assign('advertise_class',$advertise_category);
$this->assign('info', $info);
$this->display();
} /**
* 修改
*/
public function doEdit()
{
$data = I();
$rs = $this->AdvertisementObj->save($data);
if($rs===false){
$msg['code'] = 0;
$msg['msg'] = '修改失败';
}else{
$msg['code'] = 1;
$msg['msg'] = '修改成功';
}
$this->ajaxReturn($msg); } /*
* 删除
*/
public function delete()
{
$id = I('get.id');
$rs=$this->AdvertisementObj->where('id='.$id)->delete();
if ($rs==0||$rs===false) {
$msg['code'] = 0;
$msg['msg'] = '删除失败';
} else {
$msg['code'] = 1;
$msg['msg'] = '删除成功';
}
$this->ajaxReturn($msg);
} //审核通过
public function adopt(){
// $this->ajaxReturn($_GET["id"]);
// return;
$id = I('get.id');
$data['state']=1;
$res = $this->AdvertisementObj->where('id='.$id)->save($data);
if($res===false){
$msg['code'] = 0;
$msg['msg'] = '操作失败';
}else{
$msg['code'] = 1;
$msg['msg'] = '操作成功';
}
$this->ajaxReturn($msg);
} //审核拒绝
public function refuse(){
$id = I('get.id');
$data['state']=2;
$res = $this->AdvertisementObj->where('id='.$id)->save($data);
if($res===false){
$msg['code'] = 0;
$msg['msg'] = '操作失败';
}else{
$msg['code'] = 1;
$msg['msg'] = '操作成功';
}
$this->ajaxReturn($msg);
} }

  

修改页

<div class="modal-header no-padding">
<div class="table-header">
<i class="icon-lock"></i>
<button type="button" class="close" data-dismiss="modal">×</button>
添加广告
</div>
</div> <div class="modal-body overflow-visible">
<label class="control-label pull-left" style="padding:0px 10px;">类别</label>
<select id="class_id" name="class_id" class="left">
<option value="">不限</option>
<volist name="advertise_class" id="vo">
<eq name="vo.id" value="$info.class_id">
<option value="{$vo.id}" selected >{$vo.name}</option>
<else />
<option value="{$vo.id}" >{$vo.name}</option>
</eq>
</volist>
</select>
</div> <div class="modal-body overflow-visible">
<div class="control-group">
<label class="control-label" for="name">广告名称</label>
<div class="controls">
<input type="text" value="{$info.name}" required="required" id="name" name="name" placeholder="广告名称"/>
</div>
</div> <div class="control-group">
<label class="control-label" for="url">广告地址</label>
<div class="controls">
<input type="text" required="required" id="url" name="url" value="{$info.url}"
placeholder="注意添加http://"/>
</div>
</div>
<div class="control-group">
<label class="control-label" for="Pic" >广告图片</label>
<div class="controls">
<input type="file" name="Pic" id="Pic" style="display: none" onchange="uploadFile();" />
<label for="Pic">
<if condition="$info.pic eq ''">
<img class="image" width="15%" height="15%" style="width: auto; height:80px;" src="__PUBLIC__/HomeStyle/images/photo.png" >
<else/>
<img id="image" class="image" width="15%" height="15%" style="width: auto; height:80px;" src="{$info.pic}" >
</if>
</label>
</div>
</div> <div class="control-group">
<label class="control-label" for="sort">排序</label>
<div class="controls">
<input type="text" required="required" id="sort" name="sort" value="{$info.sort}"
placeholder="数字越大越靠前"/>
</div>
</div> <div class="control-group">
<label class="control-label" for="note">备注</label>
<div class="controls" >
<textarea type="text" style="height: 50px" cols="20" rows="10" required="required" id="note" name="note" >{$info.note}</textarea>
</div>
</div>
</div> <div class="modal-footer">
<button data-dismiss="modal" class="btn btn-small">
<i class="icon-remove"></i>
取消
</button>
<button type="button" class="btn btn-small btn-primary" onclick="doEdit();">
<i class="icon-ok"></i>确认
</button>
</div>
<input id="pic_hidden" value="">
<script src="__PUBLIC__/HomeStyle/js/ajaxfileupload.js"></script>
<script type="text/javascript">
//图片上传
function uploadFile() {
$.ajaxFileUpload({
url: "{:U('Admin/Advertisement/upload')}",
secureuri: false,
fileElementId: 'Pic',
dataType: 'json',
success: function (data) //服务器成功响应处理函数
{
if (data.code ==1) {
$('#pic_hidden').val(data.msg);
data.msg = data.msg + '?' + parseInt(Math.random() * 1000);
$('.image').attr('src', data.msg);
} else {
alert(data.msg);
}
},
})
} function doEdit()
{
var adv_class_id = $("#class_id").find("option:selected").attr("value");
$.ajax({
url : "{:U('Admin/Advertisement/doEdit')}",
type : 'post',
data : {
id:{$info.id},
class_id:adv_class_id,
name:$('#name').val(),
url:$('#url').val(),
pic:$('#pic_hidden').val(),
sort:$('#sort').val(),
note:$('#note').val()
},
success : function(res)
{
//alert(res);
$.lagou.alert(res.msg, res.code, 2);
$.lagou.formHide();
location.reload();
}
});
} </script>

  

列表页

<extend name="Public/base" />

{// 导航}
<block name="breadcrumb">
<li class="active">广告管理</li>
</block> {// 左侧菜单}
<block name="sidebar">
<include file="Public/sidebar" nav="advertise"/>
</block> {// 主体}
<block name="main">
<div class="row-fluid"> <h3 class="header blue lighter smaller">
<form action="{:U('Admin/Advertisement/index')}" method="get">
<div class="dataTables_wrapper">
<div class="grid_conent" id="m_search_div">
<div class="grid" style="width:28%">
<label class="control-label pull-left">广告名称:</label>
<input name="name" value="{$map.name}" type="text" id="search_name" class="pull-left" />
</div>
<div class="grid" style="width: 28%;" >
<label class="control-label pull-left">审核状态:</label>
<select name="state" class="pull-left">
<option value="">不限</option>
<option value="0" <?php if($map['state']=='0'):?> selected="selected"<?php endif;?> >待审核</option>
<option value="1" <?php if($map['state']=='1'):?>selected="selected" <?php endif;?> >已通过</option>
<option value="2" <?php if($map['state']=='2'):?>selected="selected"<?php endif;?> >已拒绝</option>
</select> </div>
<div class="grid" style="width:auto;">
<label class="control-label pull-left" style="padding-left:26px;">类别:</label>
<select name="class_id" class="left">
<option value="">不限</option>
<volist name="advertise_class" id="vo">
<eq name="vo.id" value="$map.class_id">
<option value="{$vo.id}" selected >{$vo.name}</option>
<else />
<option value="{$vo.id}" >{$vo.name}</option>
</eq>
</volist>
</select>
</div>
<div class="add_link" style=" width: auto; float: right;">
<button class="btn btn-primary btn-small" onclick="$.lagou.formShow('{:U('Admin/Advertisement/add')}');" type="button"><i class="icon-plus"></i>添加广告</button>
</div>
<div style="width:auto; float: right; padding-top:1px; "><button type="submit" class="btn btn-primary btn-small pull-left" id="search_submit"><i ></i>搜索</button></div> </div>
</div>
</form>
</h3>
<div class="table-header">广告列表</div>
<div class="dataTables_wrapper" role="grid">
<table id="data_table" class="table table-striped table-bordered table-hover" style="margin-bottom:0px;">
<thead>
<tr>
<th>广告名称</th>
<th>创建时间</th>
<th>排序</th>
<th>类别</th>
<th>审核状态</th>
<th>审核</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<?php foreach ($data as $key => $value): ?>
<tr>
<td>{$value.name}</td>
<td>{$value.create_time|date="Y-m-d H:i", ###}</td>
<td>{$value.sort}</td>
<td>{$value.class_name}</td>
<td><eq name="value.state" value="0"><i class="waitting">等待审核</i><else/><eq name="value.state" value="1">已通过<else/> <eq name="value.state" value="2"><i class="red">已拒绝</i><else/> </eq> </eq></eq></td>
<td>
<div class="hidden-phone visible-desktop action-buttons">
<a href="javascript:;" onclick="$.adopt('{:U('Admin/Advertisement/adopt', array('id'=>$value['id']))}');" class="green" >
<i>通过</i>
</a>
<a href="javascript:;" onclick="$.refuse('{:U('Admin/Advertisement/refuse', array('id'=>$value['id']))}');" class="red" >
<i>拒绝</i>
</a>
</div>
</td>
<td>
<div class="hidden-phone visible-desktop action-buttons">
<a href="javascript:;" onclick="$.lagou.formShow('{:U('Admin/Advertisement/edit', array('id'=>$value['id']))}');" class="blue tooltip-info no-hover-underline" data-rel="tooltip" data-original-title="编辑资料">
<i class="icon-pencil bigger-130"></i>
</a>
<a href="javascript:;" onclick="$.del('{:U('Admin/Advertisement/delete', array('id'=>$value['id']))}');" class="red tooltip-error no-hover-underline" data-rel="tooltip" data-original-title="删除"><i class="icon-trash bigger-130"></i></a>
</div>
</td>
</tr>
<?php endforeach ?>
</tbody>
</table>
<!-- 分页 -->
<div class="row-fluid">
<div class="page">{$page}</div>
</div>
</div>
</div> </block> {// js}
<block name="js"> <script type="text/javascript"> jQuery(function($) {
// 这就是全选按钮
$('table th input:checkbox').on('click' , function(){
var that = this;
$(this).closest('table').find('tr > td:first-child input:checkbox')
.each(function(){
this.checked = that.checked;
$(this).closest('tr').toggleClass('selected');
});
}); $.extend({ action : function(url, obj)
{
var obj = $(obj).parents('form'); $.ajax({
url : url,
type : 'get',
data : obj.serialize(),
success : function(res)
{
$.lagou.alert(res.msg, res.code, 2);
$.lagou.formHide();
location.reload();
}
});
}, del : function(url)
{ $.lagou.confirm('确认删除吗?', function(res){
if (res) {
$.get(url, function(response){
//alert(response);
$.lagou.alert(response.msg, response.code, 2);
location.reload();
});
}
});
},
//通过
adopt : function(url)
{
$.lagou.confirm('确定要通过吗?', function(res){
if (res) {
$.get(url, function(response){
$.lagou.alert(response.msg, response.code, 2);
location.reload();
});
}
});
},
//拒绝
refuse : function(url)
{
$.lagou.confirm('确定拒绝吗?', function(res){
if (res) {
$.get(url, function(response){
$.lagou.alert(response.msg, response.code, 2);
location.reload();
});
}
});
} });
})
</script>
</block>

  

Thinkphp 图片上传的更多相关文章

  1. ThinkPHP图片上传

    ThinkPHP是国内比较流行的轻量级的PHP框架,它在国内流行的一个最主要的因素在于它的说明文档非常健全完善,以及它源码内的注释都是中文的,方便于英语能力较差的程序员学习. 图片上传在网站里是很常用 ...

  2. thinkphp图片上传+validate表单验证+图片木马检测+缩略图生成

    目录 1.案例 1.1图片上传  1.2进行图片木马检测   1.3缩略图生成   1.4控制器中调用缩略图生成方法 1.案例 前言:在thinkphp框架的Thinkphp/Library/Thin ...

  3. Linux 下 ---ThinkPHP 图片上传提示:上传根目录不存在!请尝试手动创建

    2016年11月15日11:15:47 Windows下如果碰到如此问题,要看文件保存根路径里的rootpath,比如ThinkPHP框架里config.php文件里的的参数配置: //文件上传相关配 ...

  4. Ueditor 1.4.3.1 使用 ThinkPHP 3.2.3 的上传类进行图片上传

    在 ThinkPHP 3.2.3 中集成百度编辑器最新版 Ueditor 1.4.3.1,同时将编辑器自带的上传类替换成 ThinkPHP 3.2.3 中的上传类. ① 下载编辑器(下载地址:http ...

  5. thinkphp达到UploadFile.class.php图片上传功能

    片上传在站点里是非经常常使用的功能.ThinkPHP里也有自带的图片上传类(UploadFile.class.php) 和图片模型类(Image.class.php).方便于我们去实现图片上传功能,以 ...

  6. 百度编辑器前后端二开图片上传Js Thinkphp tp5 ueditor

    百度编辑器图片上传Jsueditor.all.min.js 下载链接 链接:https://pan.baidu.com/s/1VNgw9ELgRRHKeCQheFkQTw 提取码:fnfi 使用方法: ...

  7. thinkphp文件上传以及图片处理

    文件上传 上传表单 在ThinkPHP中使用上传功能无需进行特别处理.例如,下面是一个带有附件上传的表单提交: <form action="__URL__/upload" e ...

  8. Thinkphp框架图片上传实例

     https://www.cnblogs.com/wupeiky/p/5802191.html    [原文转载自:https://www.cnblogs.com/guoyachao/p/628286 ...

  9. ThinkPHP示例:图片上传

    ThinkPHP示例之图片上传,包括图片上传.数据库保存.缩略图生成以及图片水印功能演示.首先需要下载框架核心,然后把示例解压到Web根目录下面,并修改入口文件中的框架入口文件的位置.导入示例目录下面 ...

随机推荐

  1. LinuxC下获取UDP包中的路由目的IP地址和头标识目的地址

    在接受到UDP包后,有时候我们需要根据所接收到得UDP包,获取它的路由目的IP地址和头标识目的地址. (一)主要的步骤: 在setsockopt中设置IP_PKTINFO,然后通过recvmsg来获取 ...

  2. intellij 快捷键整理

    [常规] Ctrl+Shift + Enter,语句完成 “!”,否定完成,输入表达式时按 “!”键 Ctrl+E,最近的文件 Ctrl+Shift+E,最近更改的文件 Shift+Click,可以关 ...

  3. Spring IOC 容器源码分析 - 获取单例 bean

    1. 简介 为了写 Spring IOC 容器源码分析系列的文章,我特地写了一篇 Spring IOC 容器的导读文章.在导读一文中,我介绍了 Spring 的一些特性以及阅读 Spring 源码的一 ...

  4. Android开发 - 获取Android设备的唯一标识码(Android 6.0或更高)

    在我们的APP开发中,通常需要获取到设备的唯一标识.在Android6.0之前,有很多方法我们可以方便获取到硬件的唯一标识,但是在Android6.0之后,Android系统大幅限制了我们获取设备的硬 ...

  5. Linux 安装JavaEE环境之jdk安装笔记

    1.安装jdk 先用xftp将jdk的压缩包上传到 /opt/ 2.在/usr/local/下使用命令mkdir java创建java目录 将jdk-7u79-linux-x64.gz解压缩至/usr ...

  6. 《Python黑帽子:黑客与渗透测试编程之道》 Windows系统提权

    环境准备: pywin32的安装在第八章的键盘记录中有,这里还需要安装wmi: 在本人的32位win7上本来是没有easy_install这个命令的,这需要安装setuptools-0.6c11.wi ...

  7. 2018 Multi-University Training Contest 6

    A.oval-and-rectangle 题目传送门:http://acm.hdu.edu.cn/showproblem.php?pid=6362 题意:在长半轴为a,短半轴为b的椭圆内部,以y=c( ...

  8. python之ETL数据清洗案例源代码

    #python语言 import pandas as pd import time data = pd.read_excel('ETL_数据清洗挑战.xlsx','测试数据',dtype=str)#读 ...

  9. 九、将cs文件快速的转换成可执行文件和响应文件(配置编译开关的文件)

    1.将包含多个类型的源代码文件转换为可以部署的文件.有如下Program.cs的文件,代码如下: public sealed class Program { public static void Ma ...

  10. Spring Boot + Spring Cloud 实现权限管理系统 后端篇(二):数据库设计

    数据库设计 系统主要包含用户(sys_user).组织(sys_dept).角色(sys_role).菜单(sys_menu).角色组织(sys_role_dept).角色菜单(sys_role_me ...