随笔分类 - YUI3
摘要：YUI3的DataTable组件本身支持数据排序，只要在定义列的时候加上：sortable: true就可以了这里我们要解决的首先是远程排序问题远程排序就是所有数据进行排序，而不是表格本身默认的点击后在当页进行排序这个我们可以通过DataTable组件的sort方法处理例如： tabl...
阅读全文
摘要：被用户搞的想发疯。先是在IE11下开发的代码，用户说在IE8下不正常，安装了IETester测试解决了，用户还是说不对，另外找几台机器测试明明没问题跑到用户处一看，原来是新的功能没问题，旧的在线打开Word文档的页面出问题了，这个页面用的是SOAOffice，在IE8下无法打开文档，必须进入兼容模式...
阅读全文
摘要：上一篇里使用css样式虚类nonie（实际属性是定义给了yui3-panel-hidden而不是nonie）解决了在不同浏览器下的样式兼容问题其实，css虚类（未在CSS文件中定义具体属性）还有很多巧用，在大量使用JS脚本和AJAX的系统中，巧用css虚类，可以实现很多功能下面以我实际的开发例子介绍第一：使用代理时，可以通过css虚类作为类选择器例如，我在YUI的表格里，每一行上都有一列操作列，里面都是以标签形式显示操作，此列都是通过模板动态生成的，所以这些标签没有id，而指定这些标签的响应方法，必须通过代理方式，而对应的标签则通过一个虚类来指定。其实可以在生成标签时指定onclick事件，但
阅读全文
摘要：上一次通过将yui3-panel-hidden样式增加display:none属性，解决了非IE浏览器下的显示问题，见YUI3中panel基于Visibility属性引发的一个bug 本来以为解决了，结果过了周末再测试时，IE下又不对了，Panel显示后里面的内容全都看起来漂浮在页面上，Panel的背景消失了，看起来就象是panel的内容全部叠加在页面的底上，上周测试没出问题，估计是IE下js和css缓存的缘故。测试来测试去，我对这个现象很迷惑，因为只是给yui3-panel-hidden样式增加了display:none属性而已，而Panel显示后，此panel的包装div事实上是移除了该样
阅读全文
摘要：今天维护使用YUI3开发的一个统计网站，本来是想判断是否支持电子签章控件后使其支持不同呢浏览器的上报工作，这样其他的浏览器下也能操作了（但是签章就不能使用了）不想一测试，其他浏览器登录后首页功能就完全不能正常运行，页面上的li a标签的效果运行的乱七八糟一开始以为是YUI3代理之类的东西在不同浏览器上表现不一样，测试了半天，都搞不清楚哪里有问题，反正IE下是正常的，firefox,360,谷哥下面都不对后来在页面上点击a标签查看元素，结果出来的元素居然不是a标签内容，仔细看了半天，原来是一个隐藏的panel里的东西想了半天终于明白了，原来是页面上我使用了大量的panel，不显示时都隐藏在后面，
阅读全文
摘要：在ExtFrame里有一套实现了的可以延迟在需要时才加载脚本的机制，例如，当用户在树上点击用户管理时，才载入user.js创建相关的panel和表格等在YUI3里有loader机制动态加载脚本一开始我还以为可以使用loader动态加载指定路径脚本在研究了N天之后恍然大悟，原来是这样写的： YUI({ modules: { form: { async: false, fullpath: '../scripts/core/form.js' }, treeview: { async: false, fullpath: '../scrip...
阅读全文
摘要：赶在春节之前完成了这个工作流流程设计器的功能这个工作流流程设计器完全是基于前台YUI纯JS技术开发，里面综合了其他先前编写的YuiFrame的设计架构，如表格，树等（可以参考其他几篇关于YUIFrame的文章）工作流的引擎暂时没空做，驱动核心机制自然是在UI设计器之前就定下了的（和ExtFrame里的工作流还是一脉相承的，不过改动会比较大些）先放个简单的流程图树是采用的自动加载树的treeLoaderPlugin插件实现的，在页面里只需要很简单的以下几行代码就可以实现 var treeview = new Y.TreeView({ start...
阅读全文
摘要：treeview代码参见前一篇在treeview修改本地化实现后，就要考虑如何去实现自动加载树的代码在ExtJS里是通过继承并扩展TreePanel功能实现的，但是YUI3的widget继承有些问题（见Datatable）还是和Datatable的处理方式一样，为Treeview编写一个专门的plugin插件来解决问题这个plugin做两件事：1、在树创建后创建树的根节点及第一层节点，并定义各节点是否可展开2、在用户操作展开节点时获取下一层节点这样，在前台脚本里，创建树的代码就简洁到了极致首先，module里需要引入本地的treeview模块及插件模块（自己编写的dataquery），然后指定
阅读全文
摘要：在ExtFrame里，我实现了一颗可以自动加载所有节点的树（编程人员无需再为树编写一大堆代码），这颗树是通过继承Ext.TreePanel实现的但是YUI3的标准版本里，并没有树的相关实现，想做到同样功能有点难了经过查找，YUI3的Gallery里到是有treeview模块实现（版本3.7），花了几天测试，不过后来发现，原来YUI3 Gallery里有两个treeview实现，一个是Treeview（T索引），另一个是YUI Treeview（Y索引），不过我研究的是前一个，后一个咋看起来好像更好看些这个treeview的效果网页上有Demo，代码调用方式是直接使用Gallery模块，但是这种
阅读全文
摘要：和前一篇比，增加了自动读取数据的插件并完成了翻页插件的完整代码页面现在生成DataTable的代码如下： var table = new Y.DataTable({ columns: Y.TableConfig.Get('user'), scrollable: 'y', height: '200px' }); table.plug(Y.DataTablePlugin.CheckboxPlugin).plug(Y.DataTablePlugin.PageBarPlugin, { info:...
阅读全文
摘要：最近在尝试使用YUI3重建ExtFrame框架，使用YUI3做为更佳的UI和JS支持和ExtJS比，YUI3的UI看起来缺少了足够的UI控件，但是，YUI3的widget开发更灵活（也更难掌握），YUI3的widget操作更多的基于DOM封装的Yui Node而不是象ExtJS一样基于Component，扩展性更灵活在尝试将一些逻辑封装到YUI的DataTable里时遇到了点问题，在ExtJS里，可以直接通过Ext.extend建立Ext.Grid的子件，并向子件里添加属性和方法，这样，可以直接调用生成的子件就可以了，但是YUI3的widget在使用Y.Extend后，UI完全没能被正常渲染出
阅读全文
摘要：最近在用YUI3.5制作一个报表网站，遇到个问题，需要打印报表，但是YUI下我是通过model化panel来显示报表内容的，一打印就把整个网页打出来，结果是背景完全是乱的，样式也不正常YUI3的panel也是通过div实现的，于是想是否能通过只打印div内容方式实现在网上搜索了下，打印div本身还是比较容易的，代码是这样的:<script language="javascript">function printdiv(printpage){ var headstr = "<html><head><title><
阅读全文
