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; width: 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 Admin\Controller;

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 \Think\Pages($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; width: 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="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="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=" width: 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="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>

			</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>