• 個(gè)人覺(jué)得 不管是什么 CMS內(nèi)容管理框架 基本上都是為了簡(jiǎn)化 使用者的操作難度 而設(shè)計(jì)的一套根據(jù)使用者的需求而自動(dòng)生成 一套簡(jiǎn)易 使用的網(wǎng)頁(yè).
  • 但作為開(kāi)發(fā)人員 往往需要根據(jù) 需求 不停的增加 功能.如果是新手,需要開(kāi)發(fā),那么會(huì)一籌莫展.根本不知道如何解決.
  • 對(duì)于這樣問(wèn)題,想去該一些樣式,一些操作.難免會(huì)很難操作.
    我的解決方式:
    在框架拿到數(shù)據(jù)的基礎(chǔ)上 在頁(yè)面 用js 自動(dòng)生成 操作按鈕 然后用ajax post請(qǐng)求進(jìn)行數(shù)據(jù)處理
    這樣不但簡(jiǎn)單方便,而且與原有框架內(nèi)容 互不干擾.
    簡(jiǎn)易設(shè)置排序的例子:

//獲取頁(yè)面遍歷的元素 進(jìn)行動(dòng)態(tài)生成 操作按鈕
$('tbody tr').each(function()
    {
        //生成 排序按鈕
        var type = $(this).find('td').eq(3).html();
        var id = $(this).find('td').eq(1).html();
        var a = '  <a href="#" class="btn btn-successc checkup" id=" '+ id + '" type="' + type + '" style=""> 上移 </a>  '+' <a href="#" class="btn btn-successc checkdown" id=" '+ id + '" type="' + type + '" style=""> 下移 </a> ';
        $(this).find("td").eq(4).append(a);

    })
//防止點(diǎn)擊過(guò)快 造成數(shù)據(jù)出錯(cuò)
var checkstatus = 0;
    //向上排序事件
    $('.checkup').click(function () {
        var type = $(this).attr('type');
        var id = $(this).attr('id');
        var brther = $(this).parent().parent().prev();
        var btype = brther.find('td').eq(3).html();
        //判斷上一個(gè)元素是否是跟自己同一個(gè)類
        if (type == btype) {
            if (checkstatus != 0) {
                alert('操作太快了');
                return false;
            }
            $.ajax({
                url:"{:U('xxx/xxx')}",
                type:'post',
                dateType:'json',
                data:{'id':id,'type':type},
                success:function (data) {
                    if(data.status == 1) {
                        checkstatus = 1;
                        window.location.reload();
                    }
                }
            });
        } else {
           alert('已經(jīng)是最前了!~');
        }
        return false;
    })

    //向下排序事件
    $('.checkdown').click(function () {
        var type = $(this).attr('type');
        var id = $(this).attr('id');
        var brther = $(this).parent().parent().next();
        var btype = brther.find('td').eq(3).html();
        //判斷上一個(gè)元素是否是跟自己同一個(gè)類
        if (type == btype) {
            if (checkstatus != 0) {
                alert('操作太快了');
                return false;
            }
            $.ajax({
                url:"{:U('xxx/xxx')}",
                type:'post',
                dateType:'json',
                data:{'id':id,'type':type},
                success:function (data) {
                    if(data.status == 1) {
                        checkstatus = 1;
                        window.location.reload();
                    }
                }
            });
        } else {
            alert('已經(jīng)是最后了!~');
        }
        return false;
    })

然后可以在指定控制器 寫(xiě)邏輯代碼

 public function checkup()
    {
        $data = $_POST;
        $uptype = $data['type'];
        $where['type'] = $uptype;
        $res = M('表名');
        //根據(jù)類型排序 查詢上一個(gè)需要替換的 usort 和自己的 msort
        $mid = $data['id']; //自己 id
        $msort['sort'] = ''; //自己的sort
        $tsort['sort'] = ''; //上一個(gè)sort
        $tid = '';//上一個(gè) ID
        $code = $res->where($where)->order('排序字段')->select();
        if ($code) {
            //遍歷需要的值
            foreach ($code as $k => $v) {
                if ($v['id'] == $mid) {
                    $msort['sort'] = $v['sort'];
                    $tid = $code[$k - 1]['id'];
                    $tsort['sort'] = $code[$k - 1]['sort'];
                }
            }
            $a = $res->where('id = ' . $tid)->save($msort);
            $b = $res->where('id = ' . $mid)->save($tsort);
            if ($a && $b) {
                $datas['status'] = 1;
                $datas['message'] = '成功';
                $this->ajaxReturn($datas);
            } else {
                $datas['status'] = 0;
                $datas['message'] = '失敗';
                $this->ajaxReturn($datas);
            }
        }

    }

    public function checkdown()
    {
        $data = $_POST;
        $uptype = $data['type'];
        $where['type'] = $uptype;
        $res = M('表名');
        //根據(jù)類型排序 查詢上一個(gè)需要替換的 usort 和自己的 msort
        $mid = $data['id']; //自己 id
        $msort['sort'] = ''; //自己的sort
        $tsort['sort'] = ''; //下一個(gè)sort
        $tid = '';//下一個(gè) ID
        $code = $res->where($where)->order('排序字段')->select();
        if ($code) {
            //遍歷需要的值
            foreach ($code as $k => $v) {
                if ($v['id'] == $mid) {
                    $msort['sort'] = $v['sort'];
                    $tid = $code[$k + 1]['id'];
                    $tsort['sort'] = $code[$k + 1]['sort'];
                }
            }
            $a = $res->where('id = ' . $tid)->save($msort);
            $b = $res->where('id = ' . $mid)->save($tsort);
            if ($a && $b) {
                $datas['status'] = 1;
                $datas['message'] = '成功';
                $this->ajaxReturn($datas);
            } else {
                $datas['status'] = 0;
                $datas['message'] = '失敗';
                $this->ajaxReturn($datas);
            }
        }
    }

優(yōu)雅簡(jiǎn)單的操作

$('.search-form').find('input').keyup(function (event) {
                if (event.keyCode === 13) {
                    $("#search").click();
                }
            });
            $('tbody tr').each(function () {
                $(this).find('td').eq(2).find('a').attr('target', '_blank');
                var id = $(this).find('td').eq(1).html();
                var newurl = "{:U('xxx/xxx/xxx')}";
                $(this).find('td').eq(2).find('a').attr('href', newurl);
                //遍歷添加所有input 框 并賦值
                if ($(this).find('td').eq(4).html()) {
                    var id = $(this).find('td').eq(1).html();
                    var data = $(this).find('td').eq(4).html();
                    $(this).find('td').eq(4).html('<label><input class="alertaction" id="' + 'cid' + id + '" style="width: 30px;text-align: center;" type="text" name="zuire" value="' + data + '"/></label>');
                    $(this).find('td').eq(4).css('width', '15%');
                    $('input[name="zuire"]').on({
                        focus: function () {
                            $('.setSort').removeClass('hide');
                            $(this).next().removeClass('hide');
                        }
                    });
                }
            })
//自定義方法 將所有需要傳入的值 轉(zhuǎn)成數(shù)組 **********************
            var getArray=function  (e) {
                var a=[];
                $(e).each(function () {
                    a.push({
                        name : $(this).attr('id').replace('cid', ''),
                        val : $(this).val()
                    })
                })
                return a;
            }
//點(diǎn)擊發(fā)送處理
            $('.setSort').click(function () {
                var thiss = $(this);
                $.ajax({
                    url:"{:U('xxx/xxx')}",
                    type:'post',
                    dateType:'json',
                    data: {
                        data:getArray('.alertaction') //*****************************
                    },
                    success:function (data) {
                        if (data) {
                            thiss.addClass('hide');
//延遲1秒刷新
                            setTimeout(function(){window.location.reload();},1000);
                        }
                    }
                })
            })