jQuery MiniUI

标题: datagrid动态生成列 [打印本页]

作者: noheaven 时间: 2012-12-18 14:47:17 标题: datagrid动态生成列

var grid = new mini.DataGrid();
grid.set({
url: "../data/dataservice.aspx?method=SearchEmployees",
style: "width:700px;height:280px;",
valueField: "id",
columns: [
{ type: "indexcolumn" },
{ field: "loginname", width: 120, headerAlign: "center", allowSort: true },
{ field: "name", width: 120, headerAlign: "center", allowSort: true }
]
});
grid.render(document.body);
这段代码我了解，有几个问题想请教下，
1.如果在前面加入 {type:"checkcolumn"},为什么会出现单选按钮而不是多选按钮，怎么解决？
2.怎么生成多表头、合并表格头的表格，如http://www.miniui.com/demo/#src=datagrid/datagrid.html 的表格列
3.生成的datagrid，内容背景色为黄色，能修改么？
谢谢~

作者: niko 时间: 2012-12-18 16:25:12

1.multiSelct: true
2.嵌套写columns
columns: [
{header: "a",
   columns: [
      {header: "b"}
   ]
},
{header: "c"}
]
3.自定义渲染：http://www.miniui.com/demo/#src=datagrid/drawcell.html

作者: noheaven 时间: 2012-12-18 19:03:13

niko 发表于 2012-12-18 16:25
1.multiSelct: true
2.嵌套写columns
columns: [

谢谢管理员的回复，还有两个问题，望能回复
1. { type: "checkcolumn",multiSelect:true }，页面显示效果[attach]1123[/attach]，而不是[attach]1124[/attach]，没法显示为多选框的样式
2. 想让用户可以编辑动态生成的datagrid,像例子中
<div field="loginname" width="120" headerAlign="center" allowSort="true">员工帐号
<input property="editor" class="mini-textbox" style="width:100%;" />
</div>是向div标签中插入editor, datagrid是否也能动态生成可编辑的功能？
谢谢

作者: niko 时间: 2012-12-18 21:00:41

2.grid.set({multiSelect: true});
3.
columns: [
{headre:"a",
editor: {type: "textbox", style: "width:100%"}
}
]

作者: noheaven 时间: 2012-12-19 10:56:36

niko 发表于 2012-12-18 21:00
2.grid.set({multiSelect: true});
3.
columns: [

作者: factory 时间: 2012-12-19 13:47:47

noheaven 发表于 2012-12-19 10:56
var grid = new mini.DataGrid();
grid.set({
id:"datag ...

allowCellSelect:true,
allowCellEdit:true,
加了没，不加的话就是一个不可编辑的单元格

作者: noheaven 时间: 2012-12-21 12:46:00

factory 发表于 2012-12-19 13:47
allowCellSelect:true,
allowCellEdit:true,
加了没，不加的话就是一个不可编辑的单元格 ...

动态生成的datagrid,想做自动计算效果，[attach]1137[/attach]，即输入成绩后自动填写分数问题：走后台计算成绩后 e.cellHtm=100 这条语句不起作用,
grid.set({ondrawcell:"onDrawCell"});
function onDrawCell(e)
{
  $.ajax({
                  url:"../AjaxService.aspx?method=AutoCompute,
                  success:function(text)
                  {
                    if(e.field=="HundredsScore")
                     {
                        e.cellHtml=100;
                     }
                  },
                  error: function (jqXHR, textStatus, errorThrown) {
                           alert(jqXHR.responseText);
                  }
            });

}
请问问题出在哪里？谢谢

作者: noheaven 时间: 2012-12-21 12:49:25

本帖最后由 noheaven 于 2012-12-21 14:09 编辑

noheaven 发表于 2012-12-21 12:46
动态生成的datagrid,想做自动计算效果，，即输入成绩后自动填写分数问题：走后台计算成绩后 e.cellHtm=10 ...

作者: noheaven 时间: 2012-12-21 14:09:00

factory 发表于 2012-12-19 13:47
allowCellSelect:true,
allowCellEdit:true,
加了没，不加的话就是一个不可编辑的单元格 ...

alert(e.cellHtml)
可以看出e.cellHtml的值是等于qqq的，但是datagrid上就是显示不出来~

作者: factory 时间: 2012-12-21 14:15:08

noheaven 发表于 2012-12-21 12:49
function onDrawCell(e)
{
var record=e.record,

你一定要放到后台进行一个自动计算吗？
ondrawcell事件在你生成表格的时候，有一个单元格就触发一次，也就是有几个单元格，就跟后台交互几次，那样子效率跟开销都很大啊，建议你参考ondrawcell的demo，前台来自动计算

作者: noheaven 时间: 2012-12-21 14:23:34

factory 发表于 2012-12-21 14:15
你一定要放到后台进行一个自动计算吗？
ondrawcell事件在你生成表格的时候，有一个单元格就触发一次，也 ...

嗯，我也发现了ondrawcell的交互机制，谢谢，我再想想~

作者: noheaven 时间: 2012-12-21 14:40:18

factory 发表于 2012-12-21 14:15
你一定要放到后台进行一个自动计算吗？
ondrawcell事件在你生成表格的时候，有一个单元格就触发一次，也 ...

1.将前台计算的值自动赋给表格，要通过ondrawcell事件么？
2.e.cellHtml=value 这条语句不起作用，莫非不能后台传值自动赋值？
谢谢！

作者: factory 时间: 2012-12-21 14:58:20

noheaven 发表于 2012-12-21 14:40
1.将前台计算的值自动赋给表格，要通过ondrawcell事件么？
2.e.cellHtml=value 这条语句不起作用，莫非不 ...

这个肯定是可以的，不过不建议那样做，因为ondrawcell涉及的是单元格，多了的话，每次都交互一次会很慢，所以建议你把自动计算放到前台来做，把那些计算需要的规则或者值，一次性获取出来，然后再取，再去计算

欢迎光临 jQuery MiniUI (http://miniui.com/discuss/)