jqGrid edittype 选择 css 类答案

【问题标题】：jqGrid edittype select css classjqGrid edittype 选择 css 类
【发布时间】：2012-02-13 14:03:48
【问题描述】：

如何为 jqgrid 使用 edittype: select 创建的元素设置 css 类？这是我的代码：

$(window).load(function () {
            GetProjects();
        });

        function GetProjects() {
            jQuery("#tbl1").jqGrid({
                url: 'myurl',
                datatype: "json",
                mtype: 'POST',
                colNames: ['Project', 'Module', 'Description'],
                colModel: [
        { name: 'Project', index: 'Name', width: 90, editable: true, edittype: 'select', editoptions: { value: GetProjectOptions()} },
        { name: 'Name', index: 'Project.Name', width: 55, editable: true },
        { name: 'Description', index: 'Description', width: 90, editable: true }
    ],
                rowNum: 10,
                rowList: [10, 20, 30],
                pager: '#nav1',
                sortname: 'Project.Name',
                viewrecords: true,
                sortorder: "desc",
                caption: "DDS Project Modules",
                jsonReader: {
                    repeatitems: false,
                    root: function (obj) { return obj; }
                },
                width: '500',
                loadonce: true,
                hidegrid: false,
                editurl: 'myurl'
            });
            jQuery("#tbl1").jqGrid('navGrid', '#nav1', { edit: false, add: false, del: false });
        }

        function AddRow() {
            jQuery("#tbl1").jqGrid('editGridRow', "new", { reloadAfterSubmit: false, closeAfterAdd: true });
        }

我尝试在 colModel 中使用 classes: 'cssClass' ，但这没有用。以下是 html 的创建方式：

<select name="Project" class="FormElement" id="Project" role="select" size="1">

有什么建议吗？提前致谢！

【问题讨论】：

标签： css select jqgrid

【解决方案1】：

您可以定义editoptions 的dataInit 方法。比如你可以试试下面的代码

editoptions: {
    value: GetProjectOptions(),
    dataInit: function (elem) {
        $(elem).addClass('ui-state-highlight');
    }
}

结果如下：

【讨论】：

您好，感谢您的回答。它有效，我现在可以为元素设置一个类。我将您的答案标记为解决方案，但我还有一个问题。我遵循了您的示例，虽然它确实设置了我的课程并添加了一些修改，但结果与您的示例不同。你可以在这里找到我的结果：link。箭头似乎没有改变。是主题吗？您在示例中使用了什么主题？
@FlorinBombeanu：这只是网络浏览器的不同。你用的是 IE 或 Firefox，我用谷歌浏览器来做屏幕短片。
查看了应用的 css 样式，似乎没有任何改变我的箭头。我使用 IE、Chrome 和 Firefox 对此进行了测试，结果相同。我仍然认为这是主题。我已经用 Redmond 和 Lightness 进行了测试。我会继续挖掘。谢谢。