datagrid 动态生成列的问题

datagrideasyui

解决方案 »

  1.   

    自己顶下
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
    <title>salesquantityper</title>
    <link rel="stylesheet" type="text/css" href="http://www.java1234.com/jquery-easyui-1.3.3/themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="http://www.java1234.com/jquery-easyui-1.3.3/themes/icon.css">
    <link rel="stylesheet" type="text/css" href="http://www.java1234.com/jquery-easyui-1.3.3/demo/demo.css">
    <script type="text/javascript" src="http://www.java1234.com/jquery-easyui-1.3.3/jquery.min.js"></script>
    <script type="text/javascript" src="http://www.java1234.com/jquery-easyui-1.3.3/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="http://www.java1234.com/jquery-easyui-1.3.3/locale/easyui-lang-zh_CN.js"></script> </head>
    <body>
    <!-- 级联菜单 -->
    <?php $x1= isset($_POST['bt']) ? intval($_POST['bt']) : date("Y-m",strtotime("-3 month"));
    $x2 = isset($_POST['et']) ? intval($_POST['et']) :date("Y-m",strtotime("-1 month"));
    ?>

    <!-- 筛选列表 -->
    <div style="background-color:EFF7FB">
    <form id="form1" name="form1" style="margin-bottom:0px;" action="salesquantityper.php">
    <table>
    <tr>
    <td><h4>Search:</h4></td>

    <td><input class="easyui-datebox" id="bt" name="bt"  value=<?php 
    $bt=date("Y-m",strtotime("-3 month"))."-01";
    $et=date("Y-m",strtotime("-1 month"))."-01";
    echo $bt;
    ?>></input></td><td>--to--</td>
    <td><input id="et" name="et" class="easyui-datebox"  value=<?php
    echo $et;


    ?>></td>
    <td> Resgion: <select id="area" name="area" class="easyui-combobox" name="area" data-options=" multiple:true" onchange="areaChanged(this.value)" style="width:150px;">
            
            <option value="'E','N','H','S','C','W','I','B'">All Region</option>
            <option value="'E'">East</option>
            <option value="'N'">North</option>
            <option value="'H'">Center</option>
            <option value="'S'">South</option>
            <option value="'C'">NorthEast</option>
            <option value="'W'">Western</option>
            <option value="'I'">Other</option>
            
            
        </select>
        &nbsp;
    </td>
    <td>Category: <select id="level" class="easyui-combobox" name="level" data-options=" multiple:true" style="width:150px;">
            <option value="'A+','A-','A','B','C','D','OUTLETS'">All Level</option>
            <option value="'A+','A-','A'">A</option>
            <option value="'B'">B</option>
            <option value="'C'">C</option>
            <option value="'D'">D</option>
            <option value="'OUTLETS'">OUTLETS</option>
        </select>
    &nbsp;
    </td> <TD><input type="button" id="but"  value="go"  ></TD>
    </tr>
    </table>
    </form> <br>
    <div><p>Default show the data of last 3 months</p>&nbsp;</div> </div>
    <br>
    <script >
       $('#but').click(function(){  
      // alert($('#bt').datebox('getValue'));
      // $.post("t.php", { bt: $('#bt').datebox('getValue'), et:$('#et').datebox('getValue') } );
    $('#salesquantityper').datagrid('reload',{area:$('#area').combobox('getValues').join(","),level:$('#level').combobox('getValues').join(","),bt:$('#bt').datebox('getValue'),et:$('#et').datebox('getValue')});
        });
    </script>
    <!-- bestline表格 --> 
    <?php //月份的英文转换
    function getMonth($str_ym){
    $ym_list=explode("-",$str_ym);
    $yy=$ym_list[0];
    $mm=$ym_list[1];
    switch ($mm) {
    case 01 :
    return "January".$yy;
    break;
    case 02:
    return "February".$yy;
    break;
    case 03 :
    return "March".$yy;
    break;
    case 04 :
    return "April".$yy;
    break;
    case 05:
    return "May".$yy;
    break;
    case 06 :
    return "June".$yy;
    break;
    case 07 :
    return "July".$yy;
    break;
    case 08 :
    return "Aguest".$yy;
    break;
    case 09 :
    return "September".$yy;
    break;
    case 10:
    return "October".$yy;
    break;
    case 11 :
    return "November".$yy;
    break;
    case 12 :
    return "December".$yy;
    break;}
    }//生成列function xx1($str1){
    $strt=substr($str1,0,4).'-';
    return $strt.substr($str1,4,6);
    }
    function initRows1($bym,$eym){
    //判断两个日期间相差多少月
    $bym_list=explode("-",$bym);
    $eym_list=explode("-",$eym);
    if($bym_list[0]==$eym_list[0]){
    $months=abs($bym_list[1]-$eym_list[1]);
    }else{
    $months=abs(($eym_list[0]-$bym_list[0]-1)*12)+abs($eym_list[1]+(12-$bym_list[1]));
    }
    $items=array();
    for ($i=0;$i<=$months;$i++){
    echo "<th colspan='3'><strong>".substr(getMonth(date("Y-m", strtotime("+$i months $bym"))),-4).substr(getMonth(date("Y-m", strtotime("+$i months $bym"))),0,-4)."</strong></th>";
    }}function initRows2($bym,$eym){
    //判断两个日期间相差多少月
    $bym_list=explode("-",$bym);
    $eym_list=explode("-",$eym);
    if($bym_list[0]==$eym_list[0]){
    $months=abs($bym_list[1]-$eym_list[1]);
    }else{
    $months=abs(($eym_list[0]-$bym_list[0]-1)*12)+abs($eym_list[1]+(12-$bym_list[1]));
    } $items=array();
    for ($i=0;$i<=$months;$i++){
    echo"<th data-options=field:'".getMonth(date("Y-m", strtotime("+$i months $bym-01")))."_Number_stores' width='80' align='right'><strong>Nubmer of<br> Stores</strong></th>";
          echo"<th field='".getMonth(date("Y-m", strtotime("+$i months $bym-01")))."_Quantity_sold' width='100'  align='right'><strong>Quantity Sold</strong></th>";
          echo"<th field='".getMonth(date("Y-m", strtotime("+$i months $bym-01")))."_qn' width='120'  align='right'><strong>Average qty <br>Sold per store</strong></th>";
    }}?>

    <table id="salesquantityper"  class="easyui-datagrid" style="width:auto;height:220px" title="Stores sales quantity performance"
     data-options="url: 'get_salesquantityper.php', singleSelect: true,  rownumbers:true "      
     > 
    <thead data-options="frozen:true"> 
    <tr> 
    <th data-options="field:'Category'"  width="100" ><strong>Category</strong></th>
    </tr> 
    </thead> 
    <thead >
    <tr>
    <?php
    //include "t.php";
    initRows1($x1, $x2);//initRows1方法正确输出
    ?>
    </tr> 
    <tr> 
    <?php 
    initRows2($x1, $x2);
    ?> 
    </tr> 
    </thead> 
    </table></body>
    </html>
      

  2.   

    <div id="dvDataGrid">
    <table id="salesquantityper"  class="easyui-datagrid" style="width:auto;height:220px" title="Stores sales quantity performance"
     data-options="url: 'get_salesquantityper.php', singleSelect: true,  rownumbers:true "      
     > 
    <thead data-options="frozen:true"> 
    <tr> 
    <th data-options="field:'Category'"  width="100" ><strong>Category</strong></th>
    </tr> 
    </thead> 
    <thead >
    <tr>
    <?php
    //include "t.php";
    initRows1($x1, $x2);//initRows1方法正确输出
    ?>
    </tr> 
    <tr> 
    <?php 
    initRows2($x1, $x2);
    ?> 
    </tr> 
    </thead> 
    </table></div>用个容器括起datagrid的容器，查询后清空容器里面easyui生成的datagrid代码，easyui没有提供更改columns配置的方法，也没有注销datagrid的方法，只能靠清空容器来移除datagrid了。如果你用的jqgrid有提供注销jqgrid的功能点击查询
    $('#dvDataGrid').html('<table id="salesquantityper"></table>')
    //参考你另外的那个帖子，用ajax获取到columns的内容后重新调用$('#salesquantityper').datagrid()的方法生成datagrid对象加载columns新配和数据