项目用的是jeecg版的easyui http://jeecg3.mydoc.io/

需求1

<t:datagrid name="ReportList" fitColumns="true" autoLoadData="true" title="汇总表"
            actionUrl="collectionReportController.do?find" idField="id"
            fit="true" queryMode="group">
    <t:dgCol title="统计时间" field="statisticsTime" query="true"></t:dgCol>
    <t:dgCol title="活动归类" field="goryName" query="true" replace="*_*"></t:dgCol>
</t:datagrid>

上面这两个字段是开启了查询的，

对于统计时间是按input文本框查询的的，对于时间来说，手动输入时间来进行查询是很不友好的，我们可以借助mydata97这个控件，

http://www.my97.net/demo/index.htm 二. 功能及示例自定义格式这一栏

用js将datagrid的 input查询框改造成my97的样式

$(function () {
        var wdate = $('#ReportListForm').find("input[name='statisticsTime']");
        wdate.addClass("Wdate");
        wdate.attr("onclick","WdatePicker({dateFmt:'yyyy/MM/dd'})");
  });

这样就好了，就是找到需要改造的input框，直接加样式就可以了

需求二

给datagrid的查询加下拉框，

对于活动归类本来可以直接用replae 就可以展示成下拉款，但无奈的是下拉框的数据时是动态生成的，我们需要给他自己生成的下拉框加点料

扫描二维码关注公众号，回复： 4128048 查看本文章

$(function () {
        var select1 =  $('#ReportListForm').find("select[name='goryName']");
        select1.attr("id","goryName");
        select1.find("option :last").remove()//移除它原有的*号下拉值

        $.post("reportController.do?getGoryName",{},function (data) {
            $.each(data,function(i,v){
                select1.append("<option value='"+v.key+"'>"+v.value+"</option>");
            });
        },"json")
   });

这样就好了

三

easyui datagrid 的几个常见属性

<attribute>
    <name>fitColumns</name>
    <rtexprvalue>true</rtexprvalue>
    <description>当为true时，自动展开/合同列的大小，以适应的宽度，防止横向滚动</description>
</attribute>

<attribute>
    <name>fit</name>
    <rtexprvalue>true</rtexprvalue>
    <description>是否适应父容器,true 默认 ,false</description>
</attribute>

fitColumns boolean True to auto expand/contract the size of the columns to fit the grid width and prevent horizontal
scrolling. 防止grid出现水平滚动条

width    number     The width of column. If not defined, the width will auto expand to fit its contents. No width definition
will reduce performance.

fixed     boolean    True to prevent from adjusting width when 'fitColumns' is set to true.

jeec 封装的

<attribute>
    <name>fitColumns</name>
    <rtexprvalue>true</rtexprvalue>
    <description>当为true时，自动展开/合同列的大小，以适应的宽度，防止横向滚动</description>
</attribute>

<attribute>
    <name>fit</name>
    <rtexprvalue>true</rtexprvalue>
    <description>是否适应父容器,true 默认 ,false</description>
</attribute>

四 easyui datagrid的格式化

<th data-options="field:'datab',width:100,editor:{type:'datebox'},formatter:formatDate">开始时间</th>

function formatDate(value) {
   if(value==''){
       return new Date().format('yyyy-MM-dd');
    }
    return new Date().format('yyyy-MM-dd',value + '');
}

  function formatequeu(value,row,index) {
        if (row.queuStatus="320"){
            return "排队"
        } else if(row.queuStatus="300"){
            return "等待"
        }else if (row.queuStatus="340"){
            return "完成"
        }
    }

freemarker 语法含中文？号报错 （字符串加单引号）

Lexical error: encountered "\uff1f" (65311), after "".

freemarker.core.ParseException: Syntax error in template "sql_-1231282527" in line 50, column 53:

Lexical error: encountered "\uff1f" (65311), after "".

五

easyui的

getSelections   none   Return all selected rows, when no record selected, an empty array will return.
deleteRow   index   Delete a row.
getRowIndex   row   Return the specified row index, the row parameter can be a row record or an id field value.
getData   none   Return the loaded data.
getRows   none   Return the current page rows.

jeecg datagrid的一些使用技巧

需求1

需求二

三

五

猜你喜欢