如何使用asp.net c#在jqgridtd中添加样式类

本文关键字：添加 样式 jqgridtd 何使用 asp net | 更新日期: 2023-09-27 18:16:57

我想有条件地改变jqGrid中td的样式，我尝试了很多例子但没有工作，我认为我做错了什么，请查看我的代码并帮助我找出正确的代码。

My Code is

$(function () {
    $("#dataGrid").jqGrid({
        url: 'client.aspx/load_Conversation',
        datatype: 'json',
        mtype: 'POST',
        serializeGridData: function (postData) {
            return JSON.stringify(postData);
        },
        ajaxGridOptions: { contentType: "application/json" },
        loadonce: false,
        reloadGridOptions: { fromServer: true },
        colNames: ['Conversation', 'adminStatus'],
        colModel: [{ name: 'Conversation', index: 'message', width: 245 }, { name: 'adminStatus', index: 'isAdmin' }, ],
        gridComplete: function () {
            var ids = jQuery("#dataGrid").jqGrid('getDataIDs');
            for (var i = 0; i < ids.length; i++) {
                var status = jQuery("#dataGrid").jqGrid("getCell", ids[i], 'adminStatus');
                if (status == "False") {
                    $j('#' + ids[i]).removeClass("ui-widget-content");
                    $j('#' + ids[i]).addClass("ChangeStyle");
                }
            }
        },
        viewrecords: true,
        gridview: true,
        jsonReader: {
            records: function (obj) { return obj.d.length },
            root: function (obj) { return obj.d },
            repeatitems: false,
            caption: 'Live chat with us'
        }
    });
    $("#dataGrid").hideCol("adminStatus");
    $("#dataGrid").jqGrid('setGridHeight', 240);
});

My Code behind is

   public static List<Dictionary<string, object>> load_Conversation()
    {
        WebService wb= new WebService();
        DataTable dt = wb.Get();
        System.Web.Script.Serialization.JavaScriptSerializer serializer = new System.Web.Script.Serialization.JavaScriptSerializer();
        List<Dictionary<string, object>> rows = new List<Dictionary<string, object>>();
        Dictionary<string, object> row;
        foreach (DataRow dr in dt.Rows)
        {
            row = new Dictionary<string, object>();
            row.Add("Conversation", dr["messgae"]);
            row.Add("adminStatus", dr["isAdmin"]);
            rows.Add(row);
        }
        return rows;
    }

如何使用asp.net c#在jqgridtd中添加样式类

如果我正确理解从服务器返回的数据格式，您应该删除gridComplete，从colModel中删除index属性，并在adminStatus中使用cellattr，如果您需要更改adminStatus中<td>元素的样式:

colModel: [
    { name: 'Conversation', width: 245 },
    { name: 'adminStatus', cellattr: function (rowId, val) {
         if (val === "False") {
             return " class='ChangeStyle'";
         }
     }}
]

你可以在答案中看到一个非常接近使用cellattr的例子。

如何在ChangeStyle类上定义CSS规则可能很重要。如果你没有看到预期的结果，你必须包括ChangeStyle类的CSS规则的定义和你使用的jqGrid的版本。

添加以下样式和脚本

 <link type="text/css" href="http://jqueryrock.googlecode.com/svn/trunk/css/jquery-ui-1.9.2.custom.css" rel="stylesheet" />  
<link type="text/css" href="http://jqueryrock.googlecode.com/svn/trunk/jqgrid/css/ui.jqgrid.css" rel="stylesheet" />  
<script type="text/javascript" src="http://jqueryrock.googlecode.com/svn/trunk/js/jquery-1.8.3.js"></script>  
<script type="text/javascript" src="http://jqueryrock.googlecode.com/svn/trunk/js/jquery-ui-1.9.2.custom.js"></script>  
<script src="http://jqueryrock.googlecode.com/svn/trunk/jqgrid/js/grid.locale-en.js" type="text/javascript"></script>  
<script src="http://jqueryrock.googlecode.com/svn/trunk/jqgrid/js/jquery.jqGrid.min.js" type="text/javascript"></script>
在jqgridtd中使用asp.net c#
查看更多样式类
相关文章：