flexigrid 自动适应高度

[myshilin]

最近使用了表格控件 flexigrid，发现他无法自动适应页面高度，总得指定高度才行，这样在不同的浏览器，或者不同大小的显示器上显示出的效果会差出很多。

在表格初始化前自动计算出表格宽度的方法也行

[丰云]

高度？
这个要看具体情况的吧

[myshilin]

有用过flexigrid 的朋友吗？请教下

自动适应就是窗口有多大他就显示多大

[jshi123]

这和flexgrid无关，只要把让它的高度撑满页面就可以了
http://www.google.com.hk/search?hl=zh-CN&newwindow=1&safe=strict&q=%E9%AB%98%E5%BA%A6%E8%87%AA%E9%80%82%E5%BA%94&meta=&aq=f&aqi=g1g-m9&aql=&oq=&gs_rfai=

[xuan.ye]

问错地方了，这是做.net。

[kingkoo0050]

一．表的结构

1 表结构

var FriendLink = {

tableName: 'FriendLink', --表名

title: '友情链接', --显示在Grid最上面的中文

dialogtitle: '', --弹出对话框的标题

columns: [{ --表数据结构

display: '友链类型', --字段中文名称

name: 'TypeID', --数据库中的字段名称

width: 100, --在Grid上的宽度

sortable: true, --是否可以排序

align: 'left', --文字的对齐方式

process: formatForeignKeyValue, --将单元格值格式化的方法

processEditor: formatForeignKey, --将控件中值格式化的方法 （暂不用）

isdefault: null, --是否默认（暂不用）

reg: '^\d+$', --正则表达式 （验证时使用）

operator: 'Eq', --过滤查询的方式 （Like | Eq）

isPrimaryKey: false, --是否是主键

isForeignkey: true, --是否是外键

foreignkeyColumnType: 'name', --外键的类型

foreignKeyTableName: 'FriendLinkType', --外键表的名字

foreignKeytableSchma: --外键表的结构

[{display: '序号', name: 'ID', isForeignkey: false, index: 0, dataType: 'Int32'},

{display: '类型名称', name: 'Name', isForeignkey: false, index: 1, dataType: 'AnsiString'}]

}]

};

2. 共用函数

function formatMoney(value, pid) { return "￥" + parseFloat(value).toFixed(2); } –格式化货币用

function formatForeignKey(value, pid) { return value.split('_')[0]; } --格式化有外键关系的字段的值

function formatForeignKeyValue(value, pid) { return (value.split('_')[1] != '') ? value.split('_')[1] : value.split('_')[0]; } --格式化有外键关系的文本

3. flexigrid

$("#dataList").flexigrid({

height: document.documentElement.clientHeight - 155, --高度

width: $("#ptable").width() - 3, --宽度

url: "WebService/" + FriendLink.tableName + "_Get.ashx",--获取数据的服务

colModel: FriendLink.columns, --要显示的列的数据

searchitems: $.grep(FriendLink.columns, function(col, i) { return col.isSearchItem; }),

--可筛选的字段

buttons: [{ --新增按钮

name: 'Add', displayname: "新增", bclass: 'Add', onpress: toolbarItem_onclick

},{ --删除按钮

name: 'Delete', displayname: "删除", bclass: 'Delete', onpress: toolbarItem_onclick

}],

sortname: "ID", --默认排序字段

sortorder: "desc", --默认排序字段的排序顺序

title: FriendLink.title, --显示在表格上方的标题

usepager: true, --是否支持分页

useRp: false, --是否可手动设置分页每页的数据量

qtype: "TypeID", --默认查询条件字段

qop: "Eq", --默认查询字段取值方式

query: FriendLink.columns[2].defaultValue, --默认查询字段的值

rowbinddata: true, --是否将值绑定到行上

showcheckbox: true, --是否显示checkbox

rowhandler: function(row) { --行的右键事件

$(row).contextmenu({ --右键显示菜单

width: 150, --右键菜单的宽度

items: [{

text: "编辑", --按钮的名称

icon: "../css/images/icons/edit.png", --按钮的图标

alias: "contextmenu-edit", --按钮的命令

action: contextMenuItem_click --按钮执行的方法

},{

text: "删除",

icon: "../css/images/icons/rowdelete.png",

alias: "contextmenu-delete",

action: contextMenuItem_click

},{

text: "刷新",

icon: "../css/images/icons/table_refresh.png",

alias: "contextmenu-reflash",

action: contextMenuItem_click

}]

});

}

});

$(window).resize(function() {

var w = $("#ptable").width() - 3;

var gh = document.documentElement.clientHeight - 155;

$("#dataList").flexResize(w, gh);

}); --flexigrid的自动缩放

[wts_net]

--flexigrid的自动缩放