来源:http://heavengate.blog.163.com/blog/static/2023810532012629091449/
在DWZ文档中,对URL的变量替换说明如下:
HTML扩展方式navTab, dialog, ajaxTodo 的url支持变量替换。例如:__URL__/edit/id/{xxx},大括号内的xxx就是变量名,主要功能是结合table组件一起使用,利用URL变量替换,对于解决数据的删除、编辑是非常方便的。
比如:删除、编辑使用了变量{sid_user}
<tbody>中<tr target="sid_user" rel="{$vo['id']}">
当选中一行时,tr上的rel值会自动替换到url变量中.
注意url变量名{sid_user}和tr的target="sid_user"保持一致.
具体的URL变量替换使用如下:
继续之前DWZ笔记二的例子,客户信息管理的界面如下:
界面代码如下:
<%@ page language="java"import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<base href="<%=basePath%>">
<%@taglib uri="/struts-tags" prefix="s" %>
<!--分页的form-->
<form id="pagerForm" action="<%=basePath%>/admin/customer_main.action" method="post">
<inputtype="hidden"name="pageNum"value="1"/><!--【必须】value=1可以写死-->
<inputtype="hidden"name="numPerPage"value="${param.numPerPage}"/>-->
</form>
<divclass="pageHeader">
<!--查询的form-->
<form rel="pageForm" onsubmit="return navTabSearch(this);" action="<%=basePath%>/admin/customer_main.action" method="post">
<divclass="searchBar">
<ulclass="searchContent">
<li>
<label>我的客户:</label>
<inputname="keywords"type="text"size="25"value="${param.keywords}"alt="请输入客户名"/>
</li>
</ul>
<divclass="subBar">
<ul>
<li><divclass="buttonActive"><divclass="buttonContent"><buttontype="submit">检索</button></div></div></li>
<li><aclass="button"href="demo_page6.html"target="dialog"mask="true"title="查询框"><span>高级检索</span></a></li>
</ul>
</div>
</div>
</form>
</div>
<divclass="pageContent">
<divclass="panelBar">
<ulclass="toolBar">
<li><inputtype="checkbox"class="checkboxCtrl"group="ids"/>全选</li>
<li><a title="确实要删除这些记录吗?" target="selectedTodo" rel="ids" postType="string" href="<%=basePath%>/admin/customer_deleteAll.action" class="delete"><span>批量删除</span></a></li>
<li><a class="add" href="<%=basePath%>/admin/customer_addInput.jsp" target="navTab"><span>添加</span></a></li>
<li><aclass="delete"href="customer_delete.action?customer.id={cid}"target="ajaxTodo"title="确定要删除吗?"><span>删除</span></a></li>
<li><aclass="edit"href="customer_updateInput.action?id={cid}"target="navTab"><span>修改</span></a></li>
<liclass="line">line</li>
<li><aclass="icon"href="demo/common/dwz-team.xls"target="dwzExport"targetType="navTab"title="实要导出这些记录吗?"><span>导出EXCEL</span></a></li>
</ul>
</div>
<tableclass="table"width="100%"layoutH="150">
<thead>
<tr>
<thwidth="50">选择</th>
<thwidth="120">序号</th>
<th>客户昵称</th>
<thwidth="100">客户名</th>
<thwidth="150">客户类型</th>
<thwidth="80"align="center">客户状态</th>
<thwidth="80">客户邮箱</th>
<thwidth="80">创建时间</th>
<thwidth="80">上次登录时间</th>
<thwidth="80">上次登录IP</th>
</tr>
</thead>
<tbody>
<s:iteratorvalue="customers"var="c">
<trtarget="cid"rel="${c.id}">
<td><inputtype="checkbox"name="ids"value="${c.id}"/></td>
<td>${c.id}</td>
<td>${c.cus_id}</td>
<td>${c.cus_name}</td>
<td><s:iftest='#c.cus_type=="2"'>普通客户</s:if><s:else>管理员</s:else></td>
<td><s:iftest='#c.cus_isLock=="0"'>正常使用</s:if><s:else>用户锁定</s:else></td>
<td>${c.cus_email}</td>
<td>${c.cus_createtime}</td>
<td>${c.last_logintime}</td>
<td>${c.last_loginip}</td>
</tr>
</s:iterator>
</tbody>
</table>
<divclass="panelBar">
<divclass="pages">
<span>显示</span>
<selectclass="combox"name="numPerPage"onchange="navTabPageBreak({numPerPage:this.value})">
<optionvalue="20">20</option>
<optionvalue="10">10</option>
<optionvalue="30">30</option>
<optionvalue="500">50</option>
<optionvalue="100">100</option>
</select>
<span>条,共${pager.totalCount}条</span>
</div>
<!--分页组件-->
<divclass="pagination"targetType="navTab"totalCount="${pager.totalCount}"numPerPage="${pager.everyPage}"pageNumShown="10"currentPage="${pager.currentPage}"></div>
</div>
</div>
在上述代码中,对于删除和编辑的按钮设置如下:
<li>
<aclass="delete"href="customer_delete.action?customer.id={cid}"target="ajaxTodo"
title="确定要删除吗?"><span>删除</span></a>
</li>
<li><aclass="edit"href="customer_updateInput.action?id={cid}"target="navTab"><span>修改</span></a></li>
其中定义的XXX?id{cid}中的cid即为需要替换的变量,其具体定义在table中:
<tableclass="table"width="100%"layoutH="150">
<thead>
<tr>
<thwidth="50">选择</th>
<thwidth="120">序号</th>
<th>客户昵称</th>
<thwidth="100">客户名</th>
<thwidth="150">客户类型</th>
<thwidth="80"align="center">客户状态</th>
<thwidth="80">客户邮箱</th>
<thwidth="80">创建时间</th>
<thwidth="80">上次登录时间</th>
<thwidth="80">上次登录IP</th>
</tr>
</thead>
<tbody>
<s:iteratorvalue="customers"var="c">
<trtarget="cid"rel="${c.id}">
<td><inputtype="checkbox"name="ids"value="${c.id}"/></td>
<td>${c.id}</td>
<td>${c.cus_id}</td>
<td>${c.cus_name}</td>
<td><s:iftest='#c.cus_type=="2"'>普通客户</s:if><s:else>管理员</s:else></td>
<td><s:iftest='#c.cus_isLock=="0"'>正常使用</s:if><s:else>用户锁定</s:else></td>
<td>${c.cus_email}</td>
<td>${c.cus_createtime}</td>
<td>${c.last_logintime}</td>
<td>${c.last_loginip}</td>
</tr>
</s:iterator>
</tbody>
</table>
在这个table中,通过<s:iterator value="customers" var="c">,利用strut的标签,将后台的customer信息打印在页面中,同时进行关键设置<tr target="cid" rel="${c.id}">,当选中某一行时,rel="${c.id}"中的rel的值将自动替换到cid中,即通过target="cid"定义,也就是替换进删除和编辑的变量中。
相关推荐
- **url变量替换**: 自动替换URL中的变量。 - **checkbox全选/反选**: 控制复选框的状态。 - **uploadify多文件上传**: 实现文件批量上传功能。 - **combox组件**: 提供下拉列表功能。 - **suggest+lookup+主从结构*...
3. **替换图标文件**:将新图标保存到DWZ的`images`目录下,用新图标文件替换旧的或者添加新文件,并确保文件名与CSS文件引用的一致。 4. **修改CSS引用**:打开相关的CSS样式文件(通常在`css`目录下),找到菜单...
**四、JSON数据获取与初始化** 在上述示例中,`url: 'getdata.json'`指定了数据源,这通常是一个返回JSON格式数据的服务器接口。DWZ框架提供了AJAX请求方法,可以方便地与后端进行数据交互。例如,使用DWZ的`$....
【标题】"dwz-demo-1.1.6RC1.zip_DEMO_dwz php_dwz-demo_dwz-ria_php dwz" 指的是一个基于PHP的开源前端框架dwz的演示版本,版本号为1.1.6RC1。这个压缩包包含了一个名为“dwz-demo”的项目,是用于展示和学习dwz...
在DWZ中,可能会使用`lazyLoad`插件,通过监听滚动事件,判断图片距离顶部的距离,当图片将要进入视口时,替换图片的`src`属性为真实图片URL。 五、`imgZoom`文件 在提供的文件名`imgZoom`中,很可能包含了实现上述...
- **url变量替换**:自动替换URL中的占位符为实际值,简化了URL配置工作。 - **checkbox全选/反选**:支持批量操作,提高用户体验。 #### 九、文件上传与表单处理 - **uploadify多文件上传**:利用Uploadify插件...
**DWZ框架详解** DWZ,全称是“Design for Web Zen”,是一个基于Ajax技术的开源JavaScript框架,专为Web应用程序设计,旨在提高用户体验和开发效率。DWZ框架结合了前端UI设计和后端交互,提供了丰富的组件和便捷的...
标题“thinkphp3_dwz”指的是一个基于ThinkPHP 3.0框架与DWZ UI集成的项目,主要用于实现角色管理功能。在Web开发中,ThinkPHP是一个流行的PHP框架,而DWZ(Dynamic Web Zone)是一个前端jQuery UI框架,提供了一...
DWZ富客户端框架(jQuery RIA framework), 是中国人自己开发的基于jQuery实现的Ajax RIA开源框架. DWZ富客户端框架设计目标是简单实用、扩展方便、快速开发、RIA思路、轻量级 DWZ框架支持用html扩展的方式来代替...
DWZ(Design What You Want)是一款基于jQuery的国产富客户端框架,主要针对Web应用的界面设计和交互体验,被称作“jUI”。这个框架旨在简化网页开发过程,提供了一系列组件和工具,使得开发者能够快速构建功能丰富...
在DWZ中,Controller通常是一个PHP脚本,可以通过配置路由规则来映射URL。 搭建DWZ MVC框架的步骤: 1. **环境准备**:确保已经安装了PHP运行环境和MySQL数据库。下载DWZ框架的源码,解压到服务器的根目录。 2. *...
【标题】:“DWZ框架与ASP.NET MVC3的结合应用” 【内容】 DWZ框架,全称为“Dynamic Web Zone”,是一款基于JavaScript的前端UI框架,主要用于构建富互联网应用程序(RIA)。它提供了丰富的组件库,包括表格、...
【DWZ资源合集】是针对DWZ框架的一份综合性的资源集合,包含了用户指南以及相关的项目源码。DWZ,全称为“Dynamic Web Zone”,是一个基于jQuery的前端UI库,专为中国的Web开发者设计,旨在提供一套高效、简洁、易用...
学习DWZ的建议 •通读DWZ文档,很多新手提的问题文档中都写了 •看demo每个组件演示效果和代码(留意组件html结构) •建议安装firebug,用firebug看html结构、CSS和调试JS都非常方便。见附录一 firebug介绍 •对于...
DWZ富客户端框架是一种基于JavaScript的前端开发框架,它提供了一套丰富的UI组件和扩展功能,旨在简化Web应用程序的开发流程。DWZ框架具备良好的兼容性、模块化和扩展性,能够帮助开发者快速构建具有丰富交互功能的...
DWZ富客户端框架dwz-ria-1.4.6是一款专为开发高效、美观的Web应用程序而设计的后台框架。这款框架集成了多种技术,旨在简化开发过程,让开发者无需深入理解AJAX和jQuery等复杂技术,也能快速构建出与专业级应用相...
【DWZ 框架与Java Web开发】 DWZ(Design for Web Zen)是一个基于Ajax技术的开源JavaScript框架,主要用于构建富互联网应用(RIA)。它提供了丰富的UI组件、高效的Ajax交互以及优雅的页面布局,旨在简化Web开发...