jQuery相关

1、怎么使用jQuery获取标签的值或元素的内容

$('#标签id').val() 可以用来获取标签的value值，比如input标签的value值可以用它获取；

$('#标签id').text()可以用来获取标签中间的文本，比如< span>值1< /span>就可以用它获取到值1；

('#div1').html()获取到< span>123< /span>；(注意：这里获取的是带标签的，如果用.text()获取的是不带标签的)

("#a1").attr('href')获取到xxx.aspx。

2、easyUI datagrid动态修改行背景色或单元格背景色

修改行背景色：

$('#dg').datagrid({  
    rowStyler: function(index,row) {
            if (row.id == -1) {
                return ""
            }
            
            if (row.status == '2') {
                return 'background-color:#E2EFD9;';
            } 
   
            return 'background-color:#FFF2CC;';
            
        }
}); 

修改单元格背景色：

...
columns: [[
    // datagrid中定义某列的单元格
    {
        field:'status',
        title:'状态',
        halign:'center',
        align:'center',
        width:80,
        editor:{
        type:'combobox',
        options: {
            data: jobStatus,
            valueField: "value",
            textField: "text",
            editable: false,
            panelHeight:'auto'
        }
        formatter:function(value, row){
            if (Util.isEmpty(value)) {
                return "";
            } else {
                for (var i = 0; i < jobStatus.length; i++) { 
                    if (jobStatus[i].value == value) {
                        return jobStatus[i].text;
                    }
                }
            }
        },
        styler: function(value,row,index){
            if (value=='2') {
                return 'background-color:#E2EFD9;';
            } 
            if (value=='1') {
                return 'background-color:#FFF2CC;';
            }
            return "";
        }
    }
]]

3、easyUI datagrid中表头的排序按键

datagrid的点击列表头刷新，分为两种，一种是页面刷新，不涉及后台服务器数据，不会重新查询数据库，只会刷新当前页数据；一种是服务器级刷新，会重新加载数据。

3.1 页面刷新排序

Step1：将服务器对数据项排序设置为false（必须）

$("#my_datagrid").datagrid({
    ...
    remoteSort: false,  // 必须把remoteSort属性设置为false
    ...
})

Step2：把列的sortable属性设置为true，表示在这一列的表头设置排序按钮

$("#my_datagrid").datagrid({
    ...
    remoteSort: false, 
    ...
    columns:[[
        {field:"user_id", title:"工号", width:80, sortable:true}
    ]]
})

3.2 后台刷新排序

Step1：将服务器对数据项排序设置为true

$("#my_datagrid").datagrid({
    ...
    remoteSort: true, 
    ...
})

Step2：把列的sortable属性设置为true，表示在这一列的表头设置排序按钮

$("#my_datagrid").datagrid({
    ...
    remoteSort: false, 
    ...
    columns:[[
        {field:"user_id", title:"工号", width:80, sortable:true}
    ]]
})

Step3：在后台的controller中用参数sort和参数order来接收排序参数（参数名固定是这两个）sort是排序的field，order是field对应的升序（asc）还是降序（desc）

@ResponseBody
@RequestMapper("/getDataGrid")
public DatagridTO<UserVO> getDataGrid(String sort, String field) {
    ...
}

3.3 在别的函数中获取datagrid的排序参数

EasyUI获取分页等数据： $("datagridID").datagrid("options")

可以获取到Datagrid的属性信息，详细可参考EasyUI的官方文档。

如获取排序字段（可以直接获取到当前点击的排序字段）

("#my_datagrid").datagrid("options").sortOrder;