jQuery MiniUI

标题: grid分页样式能不能自己定义？ [打印本页]

作者: leap_icy 时间: 2014-4-8 14:36:27 标题: grid分页样式能不能自己定义？

grid的分页里边只有条数的合计，我想加某一列值的合计，然后显示到分页样式的下边。miniui支持吗？

作者: factory 时间: 2014-4-8 14:47:10

表格自带的分页无法支持,你可以把用独立的分页控件 ,mini-pager,放到一个toolbar里面,toolbar里面的内容是可以自定义的,然后把你的列的合计信息放到toolbar

作者: leap_icy 时间: 2014-4-10 16:21:08

factory 发表于 2014-4-8 14:47
表格自带的分页无法支持,你可以把用独立的分页控件 ,mini-pager,放到一个toolbar里面,toolbar里面的内容是 ...

http://www.miniui.com/demo/#src=datagrid/diypager.html，是不是这个例子？
如果是的话，想问一下怎么把我查出来的东西放到toolbar里。应该放一个什么控件？

作者: felt 时间: 2014-4-10 16:39:43

leap_icy 发表于 2014-4-10 16:21
http://www.miniui.com/demo/#src=datagrid/diypager.html，是不是这个例子？
如果是的话，想问一下怎么 ...

随便啊。。你只放点数据的话放个textbox之类的就可以了

作者: leap_icy 时间: 2014-4-10 16:56:52

felt 发表于 2014-4-10 16:39
随便啊。。你只放点数据的话放个textbox之类的就可以了

我方了一个SPAN在里面，现在这个分页样式后边的totle数据没有了。就是一共几页的那个

作者: felt 时间: 2014-4-10 16:59:52

leap_icy 发表于 2014-4-10 16:56
我方了一个SPAN在里面，现在这个分页样式后边的totle数据没有了。就是一共几页的那个 ...

是不是pager长度不够，把pageInfo撑没了，你加大点宽度试试

作者: factory 时间: 2014-4-10 17:00:16

leap_icy 发表于 2014-4-10 16:56
我方了一个SPAN在里面，现在这个分页样式后边的totle数据没有了。就是一共几页的那个 ...

分页控件的宽度设置小点,但是也不要太小.大概400px左右的样子吧,再小不行,因为分页控件本身内部就有一排的按钮和一些文本显示,需要占据宽度

作者: leap_icy 时间: 2014-4-10 17:38:47

factory 发表于 2014-4-10 17:00
分页控件的宽度设置小点,但是也不要太小.大概400px左右的样子吧,再小不行,因为分页控件本身内部就有一排 ...

现在是分页样式里原有totle绑定的东西不显示，miniui的例子里边貌似也不显示，有什么办法显示出来吗？
就是那个共多少页，当前第几页的那个东西。

作者: felt 时间: 2014-4-10 17:48:54

leap_icy 发表于 2014-4-10 17:38
现在是分页样式里原有totle绑定的东西不显示，miniui的例子里边貌似也不显示，有什么办法显示出来吗？
就 ...

http://www.miniui.com/demo/index ... d/pagerbuttons.html
参考这个demo，直接在pager上加好了

作者: leap_icy 时间: 2014-5-23 12:04:33

felt 发表于 2014-4-10 17:48
http://www.miniui.com/demo/index.html#src=datagrid/pagerbuttons.html
参考这个demo，直接在pager上加 ...

用这个分页样式的话，我有个合计金额想放上去，那么grid.load()直接绑定数据的时候，能不能把我的合计放到分页中？

作者: felt 时间: 2014-5-23 12:42:38

leap_icy 发表于 2014-5-23 12:04
用这个分页样式的话，我有个合计金额想放上去，那么grid.load()直接绑定数据的时候，能不能把我的合计放 ...

grid.on("load",function(){
xxxxxxxxxxxxx
})
可以监听load事件来处理的

作者: leap_icy 时间: 2014-5-23 14:29:02

可以给一个监听的具体例子吗？grid.on是用来监听load事件的，那么还需要写load吗？

作者: leap_icy 时间: 2014-5-23 14:34:09

本帖最后由 leap_icy 于 2014-5-23 14:50 编辑

leap_icy 发表于 2014-5-23 14:29
可以给一个监听的具体例子吗？grid.on是用来监听load事件的，那么还需要写load吗？ ...

<div id="datagrid1" class="mini-datagrid" style="width:700px;height:250px;"
      url="../data/AjaxService.aspx?method=SearchEmployees"  idField="id" allowResize="true"
      pagerButtons="#buttons"
>
      <div property="columns">
         <div type="indexcolumn" ></div>
         <div field="loginname" width="120" headerAlign="center" allowSort="true">员工帐号</div>
         <div field="name" width="120" headerAlign="center" allowSort="true">姓名</div>
         <div field="gender" width="100" renderer="onGenderRenderer" align="center" headerAlign="center">性别</div>
         <div field="salary" width="100" allowSort="true">薪资</div>
         <div field="age" width="100" allowSort="true">年龄</div>
         <div field="createtime" width="100" headerAlign="center" dateFormat="yyyy-MM-dd" allowSort="true">创建日期</div>
      </div>
</div>
<div id="buttons">
      <span class="separator"></span>
      <span id = "HJ"></span>
      <input class="mini-datepicker" />
</div>

这个id="HJ"的地方我想放一个金额合计上去。可不可以自己给要绑定的json中拼接一个HJ：“123”的键值对？或者用grid.on如何实现，想看一下具体实现的代码。

作者: felt 时间: 2014-5-23 15:24:04

leap_icy 发表于 2014-5-23 14:34
员工帐号
姓名
...

grid.on("load",function(e){

var hj=document.getElementById("HJ")
hj.innerHTML="xxxxxxxxxxx"
})

作者: leap_icy 时间: 2014-5-23 15:28:27

felt 发表于 2014-5-23 15:24
grid.on("load",function(e){

var hj=document.getElementById("HJ")

可是这个HJ的值我想包含在绑定datagrid的字符串里边。不想再单独请求服务器端查询了，那样太慢了。

作者: felt 时间: 2014-5-23 15:32:07

leap_icy 发表于 2014-5-23 15:28
可是这个HJ的值我想包含在绑定datagrid的字符串里边。不想再单独请求服务器端查询了，那样太慢了。 ...

load事件里面
e.xhr //是ajax对象，里面可以获取返回值的

作者: leap_icy 时间: 2014-5-26 12:05:55

那pagerbutton可不可以把分页去掉，只留工具栏，然后我自己加东西呢？

作者: felt 时间: 2014-5-26 12:20:16

leap_icy 发表于 2014-5-26 12:05
那pagerbutton可不可以把分页去掉，只留工具栏，然后我自己加东西呢？

那你showPager="false"
把我们的分页直接隐藏掉
你自己下面放个toolbar之类的东西好了

作者: leap_icy 时间: 2014-5-26 14:34:12

felt 发表于 2014-5-26 12:20
那你showPager="false"
把我们的分页直接隐藏掉
你自己下面放个toolbar之类的东西好了 ...

pagerbuttons实现不了吗？还有用toolbar的话，grid.on时间监听，然后给toolbar里面的span赋值还管用吗？

作者: felt 时间: 2014-5-26 14:58:17

leap_icy 发表于 2014-5-26 14:34
pagerbuttons实现不了吗？还有用toolbar的话，grid.on时间监听，然后给toolbar里面的span赋值还管用吗？ ...

可以的

作者: leap_icy 时间: 2014-5-26 15:11:31

felt 发表于 2014-5-26 14:58
可以的

那pagerbuttons如何去掉分页的pageSize, pageIndex这些呢？

作者: felt 时间: 2014-5-26 15:13:38

leap_icy 发表于 2014-5-26 15:11
那pagerbuttons如何去掉分页的pageSize, pageIndex这些呢？

随便你，都可以的，都一样的
不过pager上有些元素需要修改css才能隐藏掉

作者: leap_icy 时间: 2014-5-26 15:24:28

felt 发表于 2014-5-26 15:13
随便你，都可以的，都一样的
不过pager上有些元素需要修改css才能隐藏掉

那比如分页自带的reload按钮，sizeList，这些东西想去掉应该修改哪里呢？

作者: felt 时间: 2014-5-26 15:39:26

leap_icy 发表于 2014-5-26 15:24
那比如分页自带的reload按钮，sizeList，这些东西想去掉应该修改哪里呢？

请参考API
http://www.miniui.com/docs/api/index.html#ui=datagrid
除了首页、上一页、下一页、尾页这4个按钮，其他的都有API控制显示
这4个按钮，你要隐藏的话就用工具看一下样式，然后把相关的样式加一下display:none

作者: leap_icy 时间: 2014-5-26 17:42:18

felt 发表于 2014-5-26 15:39
请参考API
http://www.miniui.com/docs/api/index.html#ui=datagrid
除了首页、上一页、下一页、尾页这4 ...

我想在脚本里面写display:none，但是找了很久没找到这4个按钮的ID。能具体给一下吗？谢谢了。。。

作者: felt 时间: 2014-5-26 17:49:43

leap_icy 发表于 2014-5-26 17:42
我想在脚本里面写display:none，但是找了很久没找到这4个按钮的ID。能具体给一下吗？谢谢了。。。 ...

只能修改样式

作者: leap_icy 时间: 2014-5-26 17:57:53

felt 发表于 2014-5-26 17:49
只能修改样式

只能在css文件中修改吗？那这样不是所有页面都成这样了？

作者: felt 时间: 2014-5-26 22:57:30

leap_icy 发表于 2014-5-26 17:57
只能在css文件中修改吗？那这样不是所有页面都成这样了？

你可以在你当前页面修改，而不是修改我们的css文件

作者: leap_icy 时间: 2014-5-27 09:46:18

felt 发表于 2014-5-26 22:57
你可以在你当前页面修改，而不是修改我们的css文件

那可以告诉我一下那几个按钮的ID吗？我实在是找不到。

作者: felt 时间: 2014-5-27 10:06:27

leap_icy 发表于 2014-5-27 09:46
那可以告诉我一下那几个按钮的ID吗？我实在是找不到。

[attach]4554[/attach]
不是通过id修改的
比如说这个前一页按钮，修改这个span的样
.mini-pager-prev{
display:none
}

作者: leap_icy 时间: 2014-5-27 15:06:49

felt 发表于 2014-5-27 10:06
不是通过id修改的
比如说这个前一页按钮，修改这个span的样
.mini-pager-prev{

能不能一次把这4个的都给出？

作者: felt 时间: 2014-5-27 15:19:48

leap_icy 发表于 2014-5-27 15:06
能不能一次把这4个的都给出？

.mini-pager-first,.mini-pager-prev,.mini-pager-next,.mini-pager-last

作者: leap_icy 时间: 2014-5-28 11:59:46

felt 发表于 2014-5-27 15:19
.mini-pager-first,.mini-pager-prev,.mini-pager-next,.mini-pager-last

还有个问题。我有些页面是两个datagrid。grid1是分页的，grid2是不分页的，我想把grid2分页栏里的东西去掉，用这个css样式写，grid1的按钮也就没有了。。。有什么解决方案吗？

作者: felt 时间: 2014-5-28 12:04:24

leap_icy 发表于 2014-5-28 11:59
还有个问题。我有些页面是两个datagrid。grid1是分页的，grid2是不分页的，我想把grid2分页栏里的东西去 ...

<div id="p1" class="mini-datagrid aa"
.aa .mini-pager-first,.aa .mini-pager-prev,.aa .mini-pager-next,.aa .mini-pager-last{
display:none;
}
这样，你要隐藏的grid加个样式

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