代码之家 › 专栏 › 技术社区 › michele

JQgrid设置行高

row height jqgrid jquery javascript

michele · 技术社区 · 16 年前

我会设置每个表行的高度,但我不知道怎么做。

 function jobList(){
var json=doShowAll(); 
alert("jobList() ==> php/get_job_status.php?value="+json);
jQuery("#jobList").jqGrid({
    url:'php/get_job_status.php?value='+json,
 datatype: "xml",
    colNames:['id','title', 'start', 'stop','completed'],
    colModel:[
     {name:'id',index:'id', width:15,hidden:true, align:"center"},
     {name:'title',index:'title', width:150, align:"center"},
     {name:'start',index:'start', width:350, align:"center", sorttype:"date"},
     {name:'fine',index:'fine', width:350, align:"center", sorttype:"date"},
     {name:'completed',index:'completed', width:120, align:"center",formatter:highlight},//il solitoformatter:infractionInFormatter},  
    ],
    //rowNum:8,
    //rowList:[8,10,20,30],
    pager: '#pagerJobList',
    sortname: 'id',
    viewrecords: true,
    sortorder: "desc",
 multiselect: false,
 subGrid: false,
 autowidth: true,
 height: 250,
 rowheight: 300,

 caption: "Job Progress",
  afterInsertRow: function(rowid, aData){
     jQuery("#jobList").jqGrid('setCell', rowid, 'completed', '', {
      background: 'red',
     color: 'white'
     });
  },
  onSelectRow: function(id){
        //alert(id);
        var title="";
        if (id) { 
         var ret = jQuery("#jobList").jqGrid('getRowData',id);
         title=ret.id;
         //alert(title);
        } 
        else { 
         alert("Please select row");
        }
        var json2=doShowAll(); 
        subGrid(json2,title);
     } 

 }
);

}

修改行高值行高不变。这是我的表格结果

enter image description here

谢谢。

4 回复 | 直到 12 年前

Chait scrthq 10 年前

setRowData 方法(参见 this wiki article ). 例如,您可以在 loadComplete :

$("#list").jqGrid({
    // ...
    loadComplete: function() {
        var grid = $("#list"),
            ids = grid.getDataIDs();

        for (var i = 0; i < ids.length; i++) {
            grid.setRowData(ids[i], false, { height : 20 + (i * 2) });
        }

        // grid.setGridHeight('auto');
    }
});

working example here . 在这里您可以看到,在更改行的高度之后,最好更改网格的高度。在与 setGridHeight this .

更新 id=“列表” 您可以执行以下操作:

$("table.ui-jqgrid-htable", $("#gview_list")).css ("height", 30);

这个 $("#gview_list")

你可以看到结果 here .

aloplop85 12 年前

.ui-jqgrid .ui-jqgrid-htable th {
    height: 2em !important;
}
.ui-jqgrid tr.jqgrow td{
    height: 1em !important;
}

Chait scrthq 10 年前

ui.jqgrid.css 文件将/*body*/节中的行更改为:

.ui-jqgrid tr.jqgrow td {
    font-weight: normal; 
    overflow: hidden; 
    white-space: nowrap; 
    height: 22px; 
    padding: 0 2px 0 2px;
    border-bottom-width: 1px; 
    border-bottom-color: inherit; 
    border-bottom-style: solid;
}

white-space: 已从更改 pre 到 nowrap

-1

Diosney 13 年前

我在css样式表中设置此规则解决了此问题:

.grid .ui-jqgrid-htable th,
.grid .ui-jqgrid-btable .jqgrow td {
    height: 3em !important;
}

推荐文章

jenstar · excel-如何使用randbetween选择整行

2 年前

Demethostes90 · 定义“最后一行”值(在每周增长的图纸上)并在Range对象中使用

2 年前

Sylvia Rodriguez · 基于两列中的组合删除“重复”行(R)

2 年前

Mining · 添加行,复制以前的行值,仅为一列创建新值,仅向新行分配伪值

2 年前

Parn · POWER BI:用度量值显示单元格的值:使用动态索引||计数Dax公式?

2 年前

Shawn Janzen · 找到重复的整行并标记单个R数据帧中的微小差异的更好方法?

3 年前

user912205 · 如何在粘贴到Excel工作表之前使用临时表处理数据

3 年前

sarakhan · Flutter:如何在增加行中容器的高度时不更改文本字段的位置

3 年前

Steve · Excel VBA粘贴到具有可变行的区域

3 年前

Nina · 反应:使所有行的高度相同

3 年前