SMART datagrid v1.4 > Examples

[ grids ver.1.3.0]   Back  Forward

Row Heights  Example

자식 컬럼이 둘 이상인 수직 layout의 컬럼 그룹이 하나도 포함되지 않은 경우, DisplayOptions.variableRowHeighttrue로 지정하면, 각 데이터행의 높이를 개별적으로 다르게 할 수 있다. DisplayOptions.rowResizable이나 fixedRowResizabletrue로 지정하면, 사용자가 RowIndicator 영역의 행 아래 경계를 마우스 드래그해서 행 높이를 변경할 수 있다. 스크립트에서는 GridBase.setRowHeight를 호출해서 행 높이를 지정할 수 있다. 

또, 경계선을 더블클릭하거나 스크립트에서 GridBase.fitRowHeight를 직접 호출하면 최적의 행 높이로 자동 변경된다. 

Grid - 1

(예제 데이터는 위키피디아의 노벨문학상 리스트를 참조한 것입니다.) 


  포커스 행의 높이를 변경한다. 

포커스 행의 높이를 내용에 맞춘다. 

포커스 행의 높이를 초기화 시킨다. 

모든 행들의 높이를 초기화 시킨다. 

화면에 보이는 행모든의 높이를 내용에 맞춘다.(ver 1.4.4) 

Code -1
    var row = grdMain.focusedRow();
    if (row) {
        var h = $('#edtRowHeight').val();
        grdMain.setRowHeight(row, Math.max(4, Math.min(500, h)));
    }
Code -2
    var row = grdMain.focusedRow();
    if (row) {
        grdMain.fitRowHeight(row);
    }

소스보기 JSP 

See Also
DisplayOptions.variableRowHeight
DisplayOptions.rowResizable
fixedRowResizable
GridBase.getRowHeight
GridBase.setRowHeight
GridBase.setRowHeights
GridBase.fitRowHeight
GridBase.clearRowHeights
ColumnGroup.layout
RowIndicator
DisplayOptions.fitRowHeightWhenDisplay
Examples
Fixed Rows