thinkphp 百度编辑器和layer简单用法

百度编辑器1.4.3.3和layer插件简单案例 ：后台单页面管理

增删改查操作

此处为默认图片保存路径，如果要修改保存路径，需要修改config文件。 

添加页。

<extend name="Public/base" />

{// 导航}
<block name="breadcrumb">
    <li class="active">添加单页面</li>
</block>
{// 主体}
<div class="table-header">添加单页面</div>
<block name="main">

    <!--<form action="{:U('Admin/SinglePageManagement/doAdd')}" method="get">-->
    <form>
    <table>
        <tr>
            <td>类别</td>
            <td>
                <select name="class_id" class="left" id="class_id">
                    <option value="">不限</option>
                    <volist name="singlePage_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>
            </td>
        </tr>
        <tr>
            <td>标题：</td>
            <td><input type="text" name="name" value="" /></td>
        </tr>
        <tr>
            <td>内容</td>
            <td>
                <script id="content" name="content" type="text/plain" style="height: 600px;  700px;float: left; margin-right: 10px;"></script>
                <!--<input  type="hidden" id="contenthidden" value="" />-->
                <!--<textarea name="content"  id="content" cols="40" rows="10" ></textarea>-->
            </td>
        </tr>
        <tr>
            <td>排序：</td>
            <td><input type="text" name="sort"  /></td>
        </tr>
        <td>
            <!--<input type="submit" >-->
            <input type="button"  id="btn" onclick="submit_message();" value="保存"/>
        </td>
    </table>

    </form>
    </div>
</block>

{// js}
<block name="js">

    <script src="__PUBLIC__/Assets/js/UEditor/ueditor.config.js"></script>
    <script src="__PUBLIC__/Assets/js/UEditor/ueditor.all.js"></script>
    <script src="__PUBLIC__/Assets/js/UEditor/lang/zh-cn/zh-cn.js"></script>
    <script src="__PUBLIC__/Assets/js/layer_mobile/layer.js"></script>
    <script type="text/javascript">
        
        //根据id获取百度编辑器对象
        var ue=UE.getEditor('content');
        //初始化百度编辑器
//        $(function () {
//            ue.ready(function(){
//                //使用read后执行，否则可能报错
//                ue.setContent($("#content").val());
//            })
//        })

        //数据定义
        var  class_id;
        var  name;
        var content;
        var sort;
        function submit_message() {
            //获取数据
            class_id=$("#class_id option:selected").val();
            name=$("input[name=name]").val();
            content = ue.getContent();
            sort=$("input[name=sort]").val();
            //百度编辑器赋值给隐藏域
            //$("#contenthidden").val(encodeURIComponent(ue.getContent()));
            //提交前校验
            if(!isChecked()){
                return false;
            }
            //异步提交
            $.ajax({
                type:"post",
                url:"{:U('Admin/SinglePageManagement/doAdd')}",
                data:{
                    "class_id":class_id,
                    "name":name,
                    "content":content,
                    "sort":sort
                },
                dataType:"JSON",
                async:true,
                success:function (message) {
                    //返回值判断和输出
                    if(message=="添加成功"){
                        layer.open({
                            content:"添加成功！",
                            btn:'我知道了',
                            yes:function(){
                                window.location.href="{:U('Admin/SinglePageManagement/index')}"
                           }
                        });
                    }else{
                        layer.open({
                            content:message,
                            btn:'我知道了'
                        })
                    }
                }
            })
        }

     function isChecked(){

         if (class_id== "") {
             layer.open({
                 content: '类别不能为空！'
                 , btn: '我知道了'
             });
             return false;
         }
         if (name== "") {
             layer.open({
                 content: '标题不能为空！'
                 , btn: '我知道了'
             });
             return false;
         }
         if (content== "") {
             layer.open({
                 content: '内容不能为空！'
                 , btn: '我知道了'
             });
             return false;
         }
         if (sort=="") {
             layer.open({
                 content: '排序不能为空！'
                 , btn: '我知道了'
             });
             return false;
         }
         return true;
     }

    </script>
</block>

　　

thinkphp后台

<?php
/**
 * 单页面管理
 * @author wujiahao
 * @date   2017-5-31
 */

namespace AdminController;

class SinglePageManagementController extends BaseController {
    protected $SinglePageObj = null;
    protected $SinglePageClass=null;

    public function __construct()
    {
        parent::__construct();
        $this->SinglePageObj = M('SinglePageManagement');
        $this->SinglePageClass=M('SinglePageClass');
    }

    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时，搜索条件要带表名。
        }
        //类别
        if(!empty($a['class_id'])){
            $where['class_id']=array('EQ',$a['class_id']);
        }
        //var_dump($where);
        //分页
        $total=$this->SinglePageObj->where($where)->count();//获取总页数
        $Page= new ThinkPages($total,10);//显示10个页码
        $Page->setConfig('first','首页');
        $Page->setConfig('prev','上一页');
        $Page->setConfig('next','下一页');
        $Page->setConfig('last','尾页');
        $showPage = $Page->show();
        //搜索结果
        $data=$this->SinglePageObj->where($where)->page(I('get.p',1),10)->order('sort desc')->join('as am left join lg_single_page_class as ac on am.class_id=ac.id')->field('am.id,am.name,am.create_time,am.sort,am.content,ac.name as class_name') ->select();//get.p 表示页码,如果不存在则赋值1，每页20行。
        //var_dump($data);
        $SinglePage_category=$this->SinglePageClass->order('sort desc')->select();
        //上一次搜索条件
        $this->assign('map',$a);
        $this->assign('singlePage_class',$SinglePage_category);
        //分页
        $this->assign('page',$showPage);
        //列表
        $this->assign('data', $data);
        $this->display();

    }

    /**
     * 添加
     */
    public function add()
    {
        $SinglePage_category=$this->SinglePageClass->order('sort desc')->select();
        $this->assign('singlePage_class',$SinglePage_category);
        $this->display();
    }

    /**
     * 执行添加
     */
    public function doAdd()
    {
        $content=$_REQUEST['content'];
        $name=$_REQUEST['name'];
        $class_id=$_REQUEST['class_id'];
        $sort=$_REQUEST['sort'];
        //$class_id=$_POST['class_id']; //同理
        $data['class_id']=$class_id;
        $data['name']=$name;
        $data['content']=$content;
        $data['sort']=$sort;

//        $this->ajaxReturn($class_id);
//        return;
//        $data=I();

        $data['create_time'] = time();
        $data['state'] = 1;
        $rs = $this->SinglePageObj->add($data);
        if($rs>0){
            $msg = '添加成功';
        }else{
            $msg = '添加失败';
        }
        $this->ajaxReturn($msg);
    }

    /* 修改*/
    public function edit()
    {
        $id = I('get.id');
        $info = $this->SinglePageObj->where('id='.$id)->find();
        $SinglePage_category=$this->SinglePageClass->order('sort desc')->select();
        $this->assign('singlePage_class',$SinglePage_category);
        $this->assign('map', $info);
        $this->display();
    }

    /**
     * 修改
     */
    public function doEdit()
    {
        $id=$_REQUEST['id'];
        $content=$_REQUEST['content'];
        $name=$_REQUEST['name'];
        $class_id=$_REQUEST['class_id'];
        $sort=$_REQUEST['sort'];
        //$class_id=$_POST['class_id']; //同理
        $data['id']=$id;
        $data['class_id']=$class_id;
        $data['name']=$name;
        $data['content']=$content;
        $data['sort']=$sort;

//        $this->ajaxReturn($id);
//        return;
//        $data = I();

        $rs = $this->SinglePageObj->save($data);
        if($rs===false){
            $msg = '修改失败';
        }else{
            $msg = '修改成功';
        }
        $this->ajaxReturn($msg);
    }

    /*
     * 删除
     */
    public function delete()
    {
        $id = I('get.id');
        $rs=$this->SinglePageObj->where('id='.$id)->delete();
        if ($rs==0||$rs===false) {
            $msg['code'] = 0;
            $msg['msg'] = '删除失败';
        } else {
            $msg['code'] = 1;
            $msg['msg'] = '删除成功';
        }
        $this->ajaxReturn($msg);
    }


}

修改页

<extend name="Public/base" />

{// 导航}
<block name="breadcrumb">
    <li class="active">添加单页面</li>
</block>
{// 主体}
<div class="table-header">添加单页面</div>
<block name="main">

    <!--<form action="{:U('Admin/SinglePageManagement/doEdit')}" method="get">-->
        <form>
        <table>
            <tr>
                <td>类别</td>
                <td>
                    <select name="class_id" class="left" id="class_id">
                        <option value="">不限</option>
                        <volist name="singlePage_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>
                </td>
            </tr>
            <tr>
                <td>标题：</td>
                <td><input type="text" name="name" value="{$map.name}" /></td>
            </tr>
            <tr>
                <td>内容</td>
                <td>
                    <script id="content" name="content" type="text/plain"  style="height: 600px;  700px;float: left; margin-right: 10px;">{$map.content}</script>
                    <!--<input  type="hidden" id="contenthidden" value="" />-->
                    <!--<textarea name="content"  id="content" cols="40" rows="10" ></textarea>-->
                </td>
            </tr>
            <tr>
                <td>排序：</td>
                <td><input type="text" name="sort" value="{$map.sort}" /></td>
            </tr>
            <td>
                <!--<input type="submit" >-->
                <input type="button"  id="btn" onclick="submit_message();" value="保存"/>
            </td>
        </table>
    </form>
    </div>
</block>
{// js}
<block name="js">
    <script src="__PUBLIC__/Assets/js/UEditor/ueditor.config.js"></script>
    <script src="__PUBLIC__/Assets/js/UEditor/ueditor.all.js"></script>
    <script src="__PUBLIC__/Assets/js/UEditor/lang/zh-cn/zh-cn.js"></script>
    <script src="__PUBLIC__/Assets/js/layer_mobile/layer.js"></script>
    <script type="text/javascript">
        //根据id获取百度编辑器对象
        var ue=UE.getEditor('content');
        //初始化百度编辑器
//        $(function () {
//            ue.ready(function(){
//                //使用read后执行，否则可能报错
//                ue.setContent($("#content").val());
//            })
//        })
        //数据定义
        var  class_id;
        var  name;
        var content;
        var sort;
        function submit_message() {
            //获取数据
            class_id=$("#class_id option:selected").val();
            name=$("input[name=name]").val();
            content = ue.getContent();
            sort=$("input[name=sort]").val();
            //百度编辑器赋值给隐藏域
            //$("#contenthidden").val(encodeURIComponent(ue.getContent()));
            //提交前校验
            if(!isChecked()){
                return false;
            }
            //异步提交
            $.ajax({
                type:"post",
                url:"{:U('Admin/SinglePageManagement/doEdit')}",
                data:{
                    "id":{$map.id},
                    "class_id":class_id,
                    "name":name,
                    "content":content,
                    "sort":sort
                },
                dataType:"JSON",
                async:true,
                success:function (message) {
                    //返回值判断和输出
                    if(message=="添加成功"){
                        layer.open({
                            content:"添加成功！",
                            btn:'我知道了',
                            yes:function(){
                                window.location.href="{:U('Admin/SinglePageManagement/index')}"
                            }
                        });
                    }else{
                        layer.open({
                            content:message,
                            btn:'我知道了'
                        })
                    }
                }
            });
        }

        function isChecked(){

            if (class_id== "") {
                layer.open({
                    content: '类别不能为空！'
                    , btn: '我知道了'
                });
                return false;
            }
            if (name== "") {
                layer.open({
                    content: '标题不能为空！'
                    , btn: '我知道了'
                });
                return false;
            }
            if (content== "") {
                layer.open({
                    content: '内容不能为空！'
                    , btn: '我知道了'
                });
                return false;
            }
            if (sort== "") {
                layer.open({
                    content: '排序不能为空！'
                    , btn: '我知道了'
                });
                return false;
            }

            return true;
        }



    </script>
</block>

　　

列表页

<extend name="Public/base" />


{// 导航}
<block name="breadcrumb">
<li class="active">单页面管理</li>
</block>

{// 左侧菜单}
<block name="sidebar">
	<include file="Public/sidebar" nav="singlePage"/>
</block>

{// 主体}
<block name="main">
<div class="row-fluid">

	<h3 class="header blue lighter smaller">
		<form action="{:U('Admin/SinglePageManagement/index')}" method="get">
			<div class="dataTables_wrapper">
				<div class="grid_conent" id="m_search_div">
					<div class="grid" style="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=" 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="auto;">
						<label class="control-label pull-left" style="padding-left:26px;">类别：</label>
						<select name="class_id" class="left">
							<option value="">不限</option>
							<volist name="singlePage_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="  auto; float: right;">
						<!--<button class="btn btn-primary btn-small" onclick="$.lagou.formShow('{:U('Admin/SinglePageManagement/add')}');" type="button"><i class="icon-plus"></i>添加</button>-->
						  <a class="btn btn-primary btn-small"  href="/Admin/SinglePageManagement/add" ><i class="icon-plus"></i>添加</a>
					</div>
					<div style="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>
			</tr>
		</thead>
		<tbody>
			<?php foreach ($data as $key => $value): ?>
				<tr>
					<td>{$value.name}</td>
					<td>{$value.sort}</td>
					<td>{$value.class_name}</td>
					<td>{$value.create_time|date="Y-m-d H:i", ###}</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/SinglePageManagement/adopt', array('id'=>$value['id']))}');" class="green"  >-->
								<!--<i>通过</i>-->
							<!--</a>-->
							<!--<a href="javascript:;" onclick="$.refuse('{:U('Admin/SinglePageManagement/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/SinglePageManagement/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="{:U('Admin/SinglePageManagement/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/SinglePageManagement/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>