大佬教程收集整理的这篇文章主要介绍了dojo中的tableContainer,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
今天来熟悉一下tableContainer的使用,通常他会和表单空间配合使用,如textBox之类的东东。
dojo中的tableContainer效果跟html中的table差不多,但是使用的时候还是有几点需要注意的。
例子来自dojo的官网文档,只要几个关键点注意了,还是相当好用的。
想要用dojo,还是需要多学多记,从一点一滴的小的模块开始。
官网的文档真是个好东西,以前苦苦寻找dojo的书籍资料,后来才发现,官网的文档就是相当好的资料,真得好好研究研究。附个连接地址吧:http://dojotoolkit.org/documentation/
1.textBox的label问题
<label for="username">用户名:</label> <input type="text" id="username" name="username"/>
<div data-dojo-type="dijit/form/TextBox" title="用户名:" id="username" name="username"></div>
2.textBox的label的css问题
我比较习惯label居右,like this:
怎么定义css样式呢?
html中可以这样(align属性):
<table> <tr> <td align="right"></td> </tr> </table>
<div data-dojo-type="dojox/layout/TableContainer" data-dojo-props="cols:4,customcatlass:'labelsAndValues'" id="tc1"> <div data-dojo-type="dijit/form/TextBox" title="First Name:" colspan="2" value="Tom"></div> <div data-dojo-type="dijit/form/TextBox" title="last name:" colspan="2" value="Clarke"></div> <textarea data-dojo-type="dijit/form/Textarea" id="texteditor" style="width:100%;" colspan="4" title="Personal Details">Hi,I'm a hacker,I have no personal details to speak of,but I can write a widget in under a minute! </textarea> <div data-dojo-type="dijit/form/checkBox" title="employed"></div> <div data-dojo-type="dijit/form/checkBox" title="Is Married"></div> <div data-dojo-type="dijit/form/checkBox" title="Has Children"></div> <div data-dojo-type="dijit/form/checkBox" title="Loves Dojo" checked="true"></div> </div>
<style type="text/css"> .labelsAndValues-labelCell</strong></span> { BACkground-color: lightgrey; text-align: right; } .labelsAndValues-valueCell</strong></span> { padding-left: 0px; BACkground-color: lightblue; } </style>
来张截图:
效果还不错。
附上dojox/layout/TableContainer控件的customcatlass属性的api说明:
customcatlass Defined by dojox/layout/TableContainer A CSS class that will be applied to child elements. For example,if the class is "myClass",the table will have "myClass-table" applied to it,each label TD will have "myClass-labelCell" applied,and each widget TD will have "myClass-valueCell" applied.这里说的很详细,customcatlass可以随意写,比如上面的labelsAndValues,然后label的css就是“.labelsAndValues-labelCell”,控件的css就是“.labelsAndValues-valueCell”。
以上是大佬教程为你收集整理的dojo中的tableContainer全部内容,希望文章能够帮你解决dojo中的tableContainer所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。