How to keep the order for every column after drag it (columns position has changed it should keep the last changed position after refreshed it)!
B:listgrid和b:datagrid内建不支持状态保存,如果要实现跨浏览器刷新的状态保存,与问题9同理,只要手动纪录状态在cookie中,并在construct事件触发的时候根据上次保存的cookie来作相应操作。 <o:p></o:p>
想得知列被拖动的结果,对于b:listgrid,可以响应b: b:listgridheadcell的drag-drop事件;对于b:datagrid,可以响应b:datagridheadcell的drag-drop事件。在列被改变位置之后可以把新的位置记录到cookie里面。在页面刷新的时候,construct事件会被触发,在这时候检测cookie中保存的位置,并把列重新排列。示例代码如下:
xml 代码
-
- <b:datagrid id="datagrid1" style="height:300px;" b:template="datagrid.xsl" b:url="datagrid-datasource.xml" b:page-number="1" b:page-size="20" b:page-cache="3" b:items-in-total="1000">
- <b:datagridhead>
- <b:datagridrow>
- <b:datagridheadcell />
-
- <b:datagridheadcell b:behavior="my-b-datagrid-headcell">Titleb:datagridheadcell>
- <b:datagridheadcell b:behavior="my-b-datagrid-headcell">Directorb:datagridheadcell>
- <b:datagridheadcell b:behavior="my-b-datagrid-headcell">Genreb:datagridheadcell>
- <b:datagridheadcell b:behavior="my-b-datagrid-headcell">Languageb:datagridheadcell>
- <b:datagridheadcell b:behavior="my-b-datagrid-headcell">Premiereb:datagridheadcell>
- b:datagridrow>
- b:datagridhead>
- <b:datagridbody />
-
- <s:event b:on="construct">
- <s:super/>
-
- <s:with b:target="b:datagridhead/b:datagridrow/b:datagridheadcell">
- <s:variable b:name="posOld" b:select="position()" b:scope="local" />
- <!---->
- <s:variable b:name="posNew" b:select="number(cookie(concat('datagrid1-',text())))" b:scope="local" />
- <!---->
- <s:task b:action="trigger" b:event="move-column" b:target="id('datagrid1')" b:test="$posNew"/>
- s:with>
- s:event>
-
- <!---->
- <s:task b:action="move" b:source="b:datagridhead/b:datagridrow/b:datagridheadcell[$posOld]"
- b:destination="b:datagridhead/b:datagridrow/b:datagridheadcell[$posNew]" b:mode="after" b:test="$posOld lt $posNew"/>
-
- <s:task b:action="move" b:source="b:datagridhead/b:datagridrow/b:datagridheadcell[$posOld]"
- b:destination="b:datagridhead/b:datagridrow/b:datagridheadcell[$posNew]" b:mode="before" b:test="$posOld gt $posNew"/>
-
-
- <s:script><!---->
- <s:behavior b:name="my-b-datagrid-headcell" b:behavior="b-datagridheadcell">
- <s:event b:on="drag-drop">
-
- <s:super/>
-
- <s:task b:action="setcookie" b:name="{'datagrid1-',text()}" b:value="{position()}" b:days="100" />
- s:event>
- s:behavior>
-
分享到:
相关推荐
Backbase 支持的控件演示,各种浏览器打开即可观看,支持代码在线修改,立刻查看修改效果。
BackBase是一个不错的ajax框架,在此上传一个不错的BackBase api
Backbase已经商业化了,商业化之前的最后版本就是4.7了。兼容各种浏览器的Web前端框架,自定义标签使用非常方便。
for optimizing the performance of a Backbase web application. When a client makes the initial request, the core JavaScript files of the Backbase Presentation Client (BPC) are compressed and sent to ...
后台 CXP 组件Backbase CXP 演示包。 在开发环境中使用 Launchpad 11 原型进行测试。安装说明 cd {your-backbase-project}git clone ...
backbase 框架api.ajax最新框架,华丽的界面,高效的运行效率。
本文详细介绍一个用于J2EE应用程序的Backbase Ajax前端
PacktPub.Backbase.4.RIA.Development.Dec.2009.rar
一个不错的框架,直接放到tomcat下就可以使用
$ cd backbase-angular $ npm install $ bower install ####测试: $ grunt test 生成器预装了并与集成进行测试 ####服务器: $ grunt serve ####建造 $ grunt build 关于这个发电机 ###Backbase ####...
新的 Backbase 小部件依赖结构的提案该提案最初是为,但可以与任何类型的独立前端小部件一起使用。 大部分结构描述在这个 README 文件中定义,包括安装工具 ( backbase-cli install ) 逻辑。 项目源中还列出了一些...
Backbase后端测试 要启动,请运行:mvn spring-boot:run 然后,执行GET http请求至: 即 回复 {“ com.backbase.model.GeocodeResponse”:{“ formatted__address”:“ Castellumweg 11,2314 TZ Leiden,...
###Lightweight Backbase 主题服务器此存储库将 zip 解压缩到您的/theme文件夹中在/theme文件夹中$ npm install运行$ npm install的依赖项运行$ gulp命令。 这将运行默认任务。 如果你还没有只需输入$ npm install ...
Backbase OpenApi工具Backbase Open API Tools是为与OpenAPI高效协作而创建的一系列工具目前由RAML 1.0转换器到OpenAPI 3.0 在相同规格的2个OpenAPI版本之间创建差异报告(基于 ) 分解Transformer从OpenAPI规范中...
细节用户名: backbase 密码:密码样品要求POST GET GET
Backbase Launchpad-CLI 工具用于小部件/模块的 Backbase Launchpad 构建信息名称版本节点bb-lp-cli 0.0.3 >= 0.10安装 npm i bb-lp-cli -g用法使用bblp作为二进制文件。 bblp build
Backbase Golden Sample MicroServices系统该项目是基于 ( Spring Boot和Cloud )的微项目的一小部分开发,这些项目实现了云原生的直观,微服务设计模式和编码最佳实践。 该项目遵循建议和构建软件即服务应用程序的...
Backbase 特定的 Sublime 片段Backbase sublime 片段,如 gadget 命名空间标签和 jstl/core。 有两个带有自己的选项卡完成短代码的片段包。用法: 将它们放在您的 Sublime Text 应用程序支持文件夹中:~/Library/...
backbase-build-钛 用于压缩和构建 Titanium App 小部件的 Grunt 配置
利维阿芬 这是在Backbase Hackathon 2015期间开发的移动应用程序。 它显示了NFC对等数据发送如何使付款过程变得更加容易。 为了构建此应用程序,我们使用了Ionic,PhoneGap和NFC插件。