jquery easyui DataGrid简单示例

return "";
}
var val = dateValue.format("yyyy-mm-dd HH:MM");//控制格式
return val.substr(11, 5);
}

};

table中td内容太长自动换行

添加属性　nowrap=”false”

将nowrap: false这个属性设置在table的属性中，不要设置在字段的属性中，字段可以设置宽度，这样就可以做到当文字长度超过规定的宽度后自动换行了

行和复选框的分离

方法一：（1.3版本才能用）

checkOnSelect="false" selectOnCheck="false"

注意：当使用$(“#tbList”).datagrid(“getSelections”);时候，只有行被选中，才能取到该行。一般情况，选中行时候，行为黄色背景。

eg.<table checkOnSelect=”false”> </table> 

var selected = $("#tbList").datagrid("getSelections");
    if (selected.length == 0) {
      alert("请选择！");
      return;
    }
    var idString = "";
    $.each(selected, function (index, item) {
      idString += item.Id + ",";
    });

方法二（1.3版本之前的解决方法） 

var IsCheckFlag = true;
    $('#tbList').datagrid({
      pagination: true,
      onClickCell: function (rowIndex, field, value) {
        IsCheckFlag = false;
      },
      onSelect: function (rowIndex, rowData) {
        if (!IsCheckFlag) {
          IsCheckFlag = true;
          $("#tbList").datagrid("unselectRow", rowIndex);
        }
      },
      onUnselect: function (rowIndex, rowData) {
        if (!IsCheckFlag) {
          IsCheckFlag = true;
          $("#tbList").datagrid("selectRow", rowIndex);
        }
      }
    });

设置数据列表的样式

 $(document).ready(function () {
    //呈现列表数据
    $('#tbList').datagrid({ pagination: true,
      rowStyler: function(index,row){
          if (row.ID< 10) {//那么数据的id字段小于10的，将显示为灰色字体
            return 'color:#999;';//和一般的样式写法一样
          }
        }
      });
  });

条件查询

复选框的bug:使用参数查询时候，在查询之前选中的选项 ，在查询之后，使用getSelections方法去获取，依旧存在该选项

解决方案：通过unselectAll在查询之前清空复选框即可

$("#btnSearch").click(function () {
      $('#tbList').datagrid("unselectAll");
      $('#tbList').datagrid({ queryParams: { SearchName: $("#SearchName").val() } });
    });