1

我在网格中添加了一个 filterToolbar 搜索框，并更改了它的高度样式，就像在这个问题中一样。

我想将此输入定位在中心，（我试过了text-align:center，但没有用）。如何在列标题内居中输入框？

更新： 这是我的 colModel 代码：

{width:10,name:'Code1',index:'Code1', jsonmap:'Code1',searchoptions:{dataInit: function(elem){$(elem).css('font','15px'); $(elem).height(18);}}},
{width:40,name:'DescriptionHe1',index:'DescriptionHe1', jsonmap:'DescriptionHe1',searchoptions:{dataInit: function(elem){$(elem).css('font','15px');$(elem).height(18);}}, hidden:(language == "he")?false:true},
{width:40,name:'DescriptionEn1',index:'DescriptionEn1', jsonmap:'DescriptionEn1',searchoptions:{dataInit: function(elem){$(elem).css('font','15px');$(elem).height(18);}}, hidden:(language == "en")?false:true},                                                    
{width:10,name:'Code2',index:'Code2', jsonmap:'Code2',searchoptions:{dataInit: function(elem){$(elem).css('font','15px'); $(elem).height(18);}}},
{width:40,name:'DescriptionHe2',index:'DescriptionHe2', jsonmap:'DescriptionHe2',searchoptions:{dataInit: function(elem){$(elem).css('font','15px');$(elem).height(18);}}, hidden:(language == "he")?false:true},
{width:40,name:'DescriptionEn2',index:'DescriptionEn2', jsonmap:'DescriptionEn2',searchoptions:{dataInit: function(elem){$(elem).css('font','15px');$(elem).height(18);}}, hidden:(language == "en")?false:true}

提前致谢。

4

1 回答 1

2

我想您使用的附加 CSS 会更改 jqGrid 的默认行为。jqGrid默认将搜索工具栏中的所有输入字段居中。

要从搜索栏中更改元素的样式，您可以attr使用searchoptions。

该演示显示以下内容：

在此处输入图像描述

演示使用

cmTemplate: {
    searchoptions: {
        attr: {
            style: "width:auto;padding:0;max-width:100%"
        }
    }
}

为搜索栏的所有元素设置通用样式。此外，我为不同的列设置maxlength和size属性。例如

searchoptions: { attr: { maxlength: 6, size: 6 }}

另一个演示展示了如何为搜索工具栏的不同元素设置不同的对齐方式：

在此处输入图像描述

在我用于左对齐字段的演示中，属性

searchoptions: {
    attr: {
        maxlength: 6,
        size: 6,
        style: "width:auto;padding:0;max-width:100%;float:left"
    }
}

和

searchoptions: {
    attr: {
        maxlength: 6,
        size: 6,
        style: "width:auto;padding:0;max-width:100%;float:right"
    }
}

对于右对齐字段。

height要设置我在内部使用的输入字段的高度searchoptions.attr.style：

style: "width:auto;padding:0;max-width:100%;height:5em;float:left"

PS我另外使用了CSS

.ui-jqgrid .ui-jqgrid-htable .ui-search-toolbar th {
    height: auto; padding-bottom: 1px
}

提高搜索工具栏的一些可见性。

于 2012-12-12T12:00:50.060 回答