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

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

增删改查操作

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

添加页。

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

<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后台

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

<?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);
    }
 
 
}

修改页

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

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

列表页

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

183

184

185

186

187

188

189

190

191

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