JQuery UI---不错的选择！

最近自己在做的一个项目，名称:TShark V0.6, UI部分主要使用JQuery UI实现。
主要技术:JDK + Spring + Hibernate + JQuery + JQuery UI + JqGrid + FusionCharts
By the way:后台ORM部分使用了SpringSide的部分代码（这里感谢一下）

主要功能：
支持i18:目前只提供 English and Chinese
支持Theme更换：基于JQuery UI
提供多种系统风格：详见下图
提供了部分基础通用管理功能：用户、角色、权限、资源、菜单、工具栏。。。

Demo URL:http://do.jhost.cn/cnnetiger/system/login.html    空间是免费的速度可能有些慢（但还是要感谢一下，毕竟免费的JSP空间太少了），大家将就着看吧。

目前还存在很多问题,所以版本为0.6，待版本升到1.0后，如果有人需要，将会开源,为了保证数据的完整性，目前暂时屏蔽了数据更新操作
目前只在FireFox下做过仔细测试，所以建议使用FireFox，顺便再鄙视一下IE，你不是一般的烂...
部分代码样例

user list

<ts:toolbar />
<!--Table Search-->
<page:applyDecorator name="search">
	<page:param name="formId">roleTable_Search</page:param>
	<table class="table_search_form"><tr>
		<th><fmt:message key="label.role.name"/>:</td>
		<td>
			<input type="text" name="filter_LIKES_name"	id="filter_LIKE_name">
		</td>
		<td>
			<ts:button name="search" onClick="doSearch('roleTable_Search');"/>
			<ts:button name="reset" onClick="doReset('roleTable_Search');"/>
		</td>
		</tr>
	</table>
</page:applyDecorator>
<!--Table list-->
<ts:table id="roleTable" url="/system/role/getlistData.html" sortName="name" rowNum="20" title="label.role.list" rowNumbers="true"  ondblClickRow="viewRoleDetail">
	<ts:row>
		<ts:column display="ID" align="center" property="id" sort="string" name="id" width="20" hidden="true"/>
		<ts:column display="label.role.name" align="center" property="name" name="name" sort="string" width="20" />
		<ts:column display="label.role.description" align="center" property="description" sortable="false" name="description" width="20" />
	</ts:row>
</ts:table>

user form

<form id="userModel" method="post" name="userModel" onSubmit="return false;"> 
	<form:hidden path="userModel.id" />
	<table class="table_form">
		<tr>
			<th>*<fmt:message key="label.user.code"/>:</th>
			<td><form:input path="userModel.code" size="30"/></td>
			<th>*<fmt:message key="label.user.name"/>:</th>
			<td><form:input path="userModel.name" size="30"/></td>
		</tr>
		<tr>
			<th><fmt:message key="label.user.phone"/>:</th>
			<td><form:input path="userModel.phone" size="30"/></td>
			<th><fmt:message key="label.user.mobilePhone"/>:</th>
			<td><form:input path="userModel.mobilePhone" size="30"/></td>
		</tr>
       <tr>
			<th><fmt:message key="label.user.email"/>:</th>
			<td><form:input path="userModel.email" size="30"/></td>
			<th>*<fmt:message key="label.user.group"/>:</th>
			<td>
			<form:select path="userModel.group.id">
				<form:option value=""><fmt:message key="label.group.prompt"/></form:option>
				<form:options items="${allGroups}" itemValue="id"  itemLabel="name"/>
			</form:select>
			</td>
		</tr>
	   <tr>
			<th><fmt:message key="label.user.memo"/>:</th>
			<td colspan="3"><form:textarea path="userModel.memo" rows="3" cols="84"/></td>
		</tr>
		<tr>
		<td colspan="4">
			<fieldset class="multi-select-panel" style="margin:0;">
				<legend><fmt:message key="label.role.authorization"/></legend>
					<ul id="userRoles">
						<c:forEach var="item" items="${allRoles}" varStatus="s">
							<li class="ts-checkbox">
								<INPUT type="checkbox" id="role_${item.id}" value="${item.id}" <c:if test="${item.hasAuth == true}">checked</c:if>><label for="role_${item.id}">${item.name}</label>
							</li>
						</c:forEach>
					</ul>
			</fieldset>
		</td>
		</tr>
  </table>
	<table class="table_toolbar">
		<TR>
			<TD><ts:button name="save" onClick="doSave('/system/user/save.html','userModel');"/></TD>
			<TD><ts:button name="reset" onClick="doReset('userModel');"/></TD>
			<TD><ts:button name="return"/></TD>
		</TR>
	</table>
</form>
</div>
<v:javascript formName="userModel" staticJavascript="true" />

评论

51 楼 cnnetiger 2010-06-07  

chw8219 写道

非常好。
问下楼主系统里面弹出框、风格 都是用jquery UI 实现的么？

是的

50 楼 Nanou 2010-06-07  

很好的体系，强烈要求源码，哪怕是测试版本的，共同完善
[e-mail]

49 楼 tedadeshu 2010-06-07  

刚刚开始学习jQuery,跟高手学习

48 楼 cnnetiger 2010-06-07  

关于开源，目前TShark的问题太多，代码也比较乱，近期以下工作完成后，将开放源码
1.问题修复
2.进行一次较大的重构
3.填加必要注释

47 楼 fm_974 2010-06-04  

JQueryUI我喜欢！

46 楼 chw8219 2010-06-04  

非常好。
问下楼主系统里面弹出框、风格 都是用jquery UI 实现的么？

45 楼 ph911 2010-06-04  

作为程序员真的很不错了，希望分享[e-mail]

44 楼 xuanye 2010-06-04  

Chrome 运行还可以， 但是如果排除IE的话，真的不行啊。。国内太多IE User了

43 楼 bingufo 2010-06-04  

整体感觉很简洁实用,发挥了jquery-UI的优势,功能上好像有些单薄,最好多一些指引性操作的节目

42 楼 wangzheguilai 2010-06-04  

yifeng 写道

感兴趣，不知楼主是否开源代码，可以的话发一份
[e-mail], 谢谢

我也很感兴趣，如果可以的话也请发一份给我吧，先谢谢了。
[e-mail]

41 楼 yifeng 2010-06-04  

感兴趣，不知楼主是否开源代码，可以的话发一份
[e-mail], 谢谢

40 楼 netyjynixa 2010-06-04  

咋FLASH都用上了

39 楼 eliot1949 2010-06-04  

很不错啊，感觉jquery-ui的拖动有点慢。不是很流畅的感觉。

38 楼 yschen 2010-06-04  

对于开发人员来说，　美工做成这样，赞一个！
我们项目中也用到了Jquery，不过我们公司的UI真是烂级了，　这次的项目简直是我平生中最差的UI，准备下一个项目用全
套的JqueryUI来做，　符合整体风格，布局的话，Sitemesh应该不错吧；　粗略看了一下，找个有空的时候研究研究怎么整合Jquery。顶楼主。

37 楼 werewolf 2010-06-04  

[e-mail]
楼主共享下代码，共同研究，一起进步。

36 楼 yabar 2010-06-04  

很想用jquery ui做一个实际项目的，替换之前的ui组件。。
期待开源哦~

35 楼 bevis.cn 2010-06-04  

美工方面，实在是不是敢恭维，不过作为程序来说，不算差

34 楼 huanggang212 2010-06-04  

感觉还真不错，目前公司项目就要用到jquery ui，正在学习中。。。
期待楼主项目的开源！

33 楼 orcl_zhang 2010-06-04  

挺不错的。我觉得ui还是很漂亮的。
很多小功能上还是很漂亮的。
不过，有些地方感觉有点花，我还是很期待比较简洁的画面。
投个精华。

32 楼 孤独浪子 2010-06-04  

太棒了哦，楼主期待开源哦，哈哈
可以的话请发一份源代码给我谢谢！[e-mail]