php+ajax+easyUI datagrid のシンプルで完全なデモを探しています

タイトルにあるように、ajax を使用して easyUI データ テーブルを部分的に更新する例を提供してください。これは簡単で完全なものであるはずです。

ディスカッションへの返信 (解決策)

これはちょっとしたデモです。煩雑で使い方がわかりません。

用户资料    public function index() {        //搜索        if($this->isAjax())        {            $type = $_POST['type'];            $uservalue = $_POST['uservalue'];            $gametype = $_POST['gametype'];            $channeltype = $_POST['channeltype'];            $moneytype = $_POST['moneytype'];            $sdate = $_POST['sdate'];            $edate = $_POST['edate'];            if(empty($uservalue)) die(json_encode(array("total"=>0,"rows"=>array())));            if ($type=='username' || $type == 'nickname') {                if($type == 'username') {                    $where = "username = '".$uservalue."'";                }elseif($type == 'nickname') {                    $where = "nick_name = '".$uservalue."'";                }                $userInfo = $this->model->where($where)->select();                $userid = $userInfo['userid'];            }else {                $userid = $uservalue;            }            if (empty($userid))  {                $this->error('请输入正确的用户ID','',true);            }            //判断时间            $startdate=strtotime($sdate);            $enddate=strtotime($edate);            if(empty($startdate) || empty($enddate)) {                $this->error('开始时间和结束时间不能为空','',true);            }            if($startdate > $enddate) {                $this->error('结束时间小于开始时间','',true);            }            $days=round(($enddate-$startdate)/3600/24) ;            if($days >7) {               $this->error('查询数据大于7天了，建议选择上小于7天进行查询','',true);            }            $j=0;            $exdata = explode('-',$sdate);            $gamemodel = $this->selDb('LOG');            $accs = array();            $games = array();            for($i = strtotime($sdate); $i <= strtotime($edate); $i += 86400) {                $y=mktime(0,0,0,$exdata[1],$exdata[2],$exdata[0]);                $t=date("Ymd",$y+$j*24*3600);                $j++;                //通过天数分库的->field('userid,moneychange,moneytype,ts,moneyfrom')                $sql1 ="select userid,moneychange,moneytype,ts,moneyfrom,user_accunt_change_date from ".$this->accTName.$t." where  userid = '$userid' AND moneytype in($moneytype) AND moneyfrom in ($channeltype) group by userid,moneyfrom,moneytype";                $sql ="select userid,moneychange,moneytype,gameid,ts,moneyfrom,game_win_log_date from ".$this->gameWinName.$t." where  userid = '$userid' AND moneytype in($moneytype) AND moneyfrom in ($channeltype) AND gameid in ($gametype) group by userid,gameid";                $games[] = $gamemodel->query($sql);                $accs[] = $gamemodel->query($sql1);            }            //合并数据            $arr = array();            $brr = array();            if(!empty($accs)) {                foreach($accs as $k=>$v) {                    if(empty($v)) {                        unset($accs[$k]);                    }else {                        foreach($v as $kk=>$vv) {                            $vv['data'] = $vv['user_accunt_change_date'];                            $vv['flag'] = 'account';                            $arr[] = $vv;                        }                    }                }            }            if(!empty($games)) {                //合并数据                foreach($games as $k=>$v) {                    if(empty($v)) {                        unset($games[$k]);                    }else {                        foreach($v as $kk=>$vv) {                            $vv['data'] = $vv['game_win_log_date'];                            $vv['flag'] = 'game';                            $brr[] = $vv;                        }                    }                }            }            $result = array_merge($arr,$brr);            die(json_encode(array('total'=>count($result),"rows"=>$result?$result:array())));            //查询game_win_log_时间和user_acount_change_log_时间两个表中的综合数据        }        $this->display();    }jquery$("#datagrid").datagrid("selectRow",index);var row = $("#datagrid").datagrid("getSelected");    //搜索    function searchform(){        //$("#datagrid").datagrid("load",vac.serializeObject($("#searchForm"));        vac.ajax('/UserManage/index', vac.serializeObject($("#searchForm")), 'POST', function(r){            if(r.status != undefined){                vac.alert(r.info);            }else{                $("#datagrid").datagrid("loadData",r);            }        });    }返回值处理    /**     +----------------------------------------------------------     * Ajax方式返回数据到客户端     +----------------------------------------------------------     * @access protected     +----------------------------------------------------------     * @param mixed $data 要返回的数据     * @param String $info 提示信息     * @param boolean $status 返回状态     * @param String $status ajax返回类型 JSON XML     +----------------------------------------------------------     * @return void     +----------------------------------------------------------     */    protected function ajaxReturn($data,$info='',$status=1,$type='') {        $result  =  array();       $result['status']  =  $status;        $result['info'] =  $info;        $result['data'] = $data;        //扩展ajax返回数据, 在Action中定义function ajaxAssign(&$result){} 方法 扩展ajax返回数据。        if(method_exists($this,'ajaxAssign'))             $this->ajaxAssign($result);        if(empty($type)) $type  =   C('DEFAULT_AJAX_RETURN');        if(strtoupper($type)=='JSON') {            // 返回JSON数据格式到客户端 包含状态信息            header('Content-Type:text/html; charset=utf-8');            exit(json_encode($result));        }elseif(strtoupper($type)=='XML'){            // 返回xml格式数据            header('Content-Type:text/xml; charset=utf-8');            exit(xml_encode($result));        }elseif(strtoupper($type)=='EVAL'){            // 返回可执行的js脚本            header('Content-Type:text/html; charset=utf-8');            exit($data);        }else{            // TODO 增加其它格式        }    }

easyui を使用します - グリッド コントロールの updateRow メソッドは、ローカル更新の効果を実現するために指定された行を更新します

$('#dg').datagrid('updateRow',{	index: 2,	row: {		name: 'new name',		note: 'new note message'	}});

行データは ajax リクエストによって取得されます (あなたはxml ではなく php の json 形式を返す必要があります) 次に、このメソッドを使用して部分更新します。その他の詳細については、公式ドキュメントを参照してください

easyui-grid コントロールの updateRow メソッドを使用して、指定された行を更新して、次の効果を実現します部分更新

$('#dg').datagrid('updateRow',{	index: 2,	row: {		name: 'new name',		note: 'new note message'	}});

行のデータは ajax リクエストによって取得されます (php で返すのが最適です。xml ではなく json 形式です)。その後、このメソッドを使用して部分更新を実行します。その他の詳細については、を参照してください。公式ドキュメント
このテーブルのデータを更新するために ajax を使用する方法は次のとおりです。

js セクションの投稿をご覧ください