能动的按钮导航条
按钮导航条在dorado中是DataPilot控件,可以实现对Dataset数据集中的记录进行滚动、翻页、增删改、验证、撤销等操作。
在datatable的ViewModel中新建DataPilot控件。步骤:【Controls】—>【Insert】—>【Pilot】—>【DataPilot】。
图12-46
在【Set Properties】中设置新建的DataPilot绑定datasetEmployee,命名datapilotEmployee。
图12-47
将datapilotEmployee控件添加至JSP页面中,保存全部修改后刷新页面,查看效果。
图12-48
可以点击其中的记录滚动按钮(单三角键 、 )以及翻页按钮(双三角键 、 )查看效果,或者点击【添加】、【删除】等按钮操作添加记录或删除记录。
DataPilot默认情况下拥有11个按钮提供对数据集的操作,我们可以根据它的属性按照自己的需求设置需要展现或者隐藏的功能按钮。
详细的页码导航条
按钮导航条Datapilot可以实现对Dataset数据集对象的翻页、记录滚动以及对记录的增删等操作,但它仍然不能满足我们的另外一种需求,即分页页码显示。DataPilot所实现的翻页是顺序式的,只能进行上一页、下一页的翻页,而无法实现跳跃式的翻页,也无从得知目前的页码索引。页码导航条可以实现页码索引式的分页导航。
页码导航条在dorado中是PagePilot控件,它可以清楚地显示所绑定的Dataset对象共分有多少页,可以任意加载指定页的数据。
在datatable的ViewModel中新建PagePilot控件。 步骤:【Controls】—>【Insert】—>【Pilot】—>【PagePilot】。
图12-49
在【Set Properties】中设置新建的PagePilot绑定datasetEmployee,命名pagepilotEmployee。
图12-50
将pagepilotEmployee控件添加至JSP页面中,保存全部修改后刷新页面,查看效果。
图12-51
由于我们没有对datasetEmployee进行分页设置,而在dorado中的Dataset数据集默认pageSize属性值为100。因此pagepilotEmployee控件显示的结果是只有1页数据共60条记录。设置datasetEmployee的pageSize属性值为6。
图12-52
保存修改,刷新页面查看pagepilotEmployee控件。
图12-53
从页面展现中可以看出,PagePilot控件会列出总页数,并且提示当前页以及总记录数。我们可以设置PagePilot的maxLink属性值改变所列出的页数,例如设置值为4。保存之后查看效果。
图12-54
当我们点击第4页之后的页索引,除了第1页和最后1页,中间部分始终保持4个页索引显示。
图12-55
另外,我们还可以在输入框中输入我们想要加载的页码。默认情况下,该输入框已经实现了自动校验功能,如果输入非数字字符或者超出最大页索引,都将提示错误信息"无效的页号!"。
图12-56
特别地,PagePilot控件也可以在设置pilotType属性值为button时,实现按钮式的翻页展现。
图12-57
保存刷新页面之后,查看按钮风格的页码导航条。
图12-58
Attachments:
worddav4554dd3e818b19e667becc252c274abc.png (image/png)
worddavc87436c9789c120cf20589376fc56151.png (image/png)
worddavac677f6cd47e35537febf3a9c38c94b9.png (image/png)
worddav27f9423fb7abaff7914bc74312e39b8d.png (image/png)
worddavceb38042ee6fdec1c3bb139457c8cb30.png (image/png)
worddavbf109ba7706f6f8d10f41a948ed2ef22.png (image/png)
worddav948882bb08eda23534d4df59b9be1f1b.png (image/png)
worddav33625f86b864c40824443b36710df109.png (image/png)
worddav208bacb7633cfc6cf8287ccab0322625.png (image/png)
worddavbf93dedc7806b17fc7754a1c77497f87.png (image/png)
worddavdc06a1a13f884781222d11fc1e4daa9e.png (image/png)
worddavf5ed94eea0f47d658704db996171a1b5.png (image/png)
worddav0d46c221038898787c25d3a363658344.png (image/png)
worddave4ae9d19e8a5fea293e4e0a7121e725e.png (image/png)
worddavca5cf4a1d0f4e53e1b745986228db4b8.png (image/png)
worddav39c1671d30aa7518972f040624d83022.png (image/png)