`

《DWZ笔记四》URL变量替换

阅读更多

 

来源: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笔记二的例子,客户信息管理的界面如下:

《DWZ笔记四》URL变量替换 - heavengate - Heavengate的博客

 

界面代码如下:

<%@ 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"定义,也就是替换进删除和编辑的变量中。
分享到:
评论

相关推荐

    DWZ使用帮助文档

    - **url变量替换**: 自动替换URL中的变量。 - **checkbox全选/反选**: 控制复选框的状态。 - **uploadify多文件上传**: 实现文件批量上传功能。 - **combox组件**: 提供下拉列表功能。 - **suggest+lookup+主从结构*...

    dwz修改菜单图标

    3. **替换图标文件**:将新图标保存到DWZ的`images`目录下,用新图标文件替换旧的或者添加新文件,并确保文件名与CSS文件引用的一致。 4. **修改CSS引用**:打开相关的CSS样式文件(通常在`css`目录下),找到菜单...

    dwz 学习文档

    18. **URL变量替换**: 动态替换URL中的参数。 19. **Checkbox全选/反选**: 控制复选框的全选和反选操作。 20. **Uploadify多文件上传**: 支持一次上传多个文件。 21. **Combox组件**: 实现下拉列表选择功能。 22. **...

    jqgird dwz 框架扩展

    **四、JSON数据获取与初始化** 在上述示例中,`url: 'getdata.json'`指定了数据源,这通常是一个返回JSON格式数据的服务器接口。DWZ框架提供了AJAX请求方法,可以方便地与后端进行数据交互。例如,使用DWZ的`$....

    dwz-demo-1.1.6RC1.zip_DEMO_dwz php_dwz-demo_dwz-ria_php 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页面图片显示js

    在DWZ中,可能会使用`lazyLoad`插件,通过监听滚动事件,判断图片距离顶部的距离,当图片将要进入视口时,替换图片的`src`属性为真实图片URL。 五、`imgZoom`文件 在提供的文件名`imgZoom`中,很可能包含了实现上述...

    dwz-user-guide.pdf

    - **url变量替换**:自动替换URL中的占位符为实际值,简化了URL配置工作。 - **checkbox全选/反选**:支持批量操作,提高用户体验。 #### 九、文件上传与表单处理 - **uploadify多文件上传**:利用Uploadify插件...

    dwz框架官网实例

    **DWZ框架详解** DWZ,全称是“Design for Web Zen”,是一个基于Ajax技术的开源JavaScript框架,专为Web应用程序设计,旨在提高用户体验和开发效率。DWZ框架结合了前端UI设计和后端交互,提供了丰富的组件和便捷的...

    thinkphp3_dwz

    标题“thinkphp3_dwz”指的是一个基于ThinkPHP 3.0框架与DWZ UI集成的项目,主要用于实现角色管理功能。在Web开发中,ThinkPHP是一个流行的PHP框架,而DWZ(Dynamic Web Zone)是一个前端jQuery UI框架,提供了一...

    DWZ文件+文档

    DWZ富客户端框架(jQuery RIA framework), 是中国人自己开发的基于jQuery实现的Ajax RIA开源框架. DWZ富客户端框架设计目标是简单实用、扩展方便、快速开发、RIA思路、轻量级 DWZ框架支持用html扩展的方式来代替...

    dwz - 简单实用国产jQuery UI框架 - DWZ富客户端框架(jUI)

    DWZ(Design What You Want)是一款基于jQuery的国产富客户端框架,主要针对Web应用的界面设计和交互体验,被称作“jUI”。这个框架旨在简化网页开发过程,提供了一系列组件和工具,使得开发者能够快速构建功能丰富...

    mvc搭建DWZ框架

    在DWZ中,Controller通常是一个PHP脚本,可以通过配置路由规则来映射URL。 搭建DWZ MVC框架的步骤: 1. **环境准备**:确保已经安装了PHP运行环境和MySQL数据库。下载DWZ框架的源码,解压到服务器的根目录。 2. *...

    dwz框架 asp.net mvc3

    【标题】:“DWZ框架与ASP.NET MVC3的结合应用” 【内容】 DWZ框架,全称为“Dynamic Web Zone”,是一款基于JavaScript的前端UI框架,主要用于构建富互联网应用程序(RIA)。它提供了丰富的组件库,包括表格、...

    DWZ资源合集

    【DWZ资源合集】是针对DWZ框架的一份综合性的资源集合,包含了用户指南以及相关的项目源码。DWZ,全称为“Dynamic Web Zone”,是一个基于jQuery的前端UI库,专为中国的Web开发者设计,旨在提供一套高效、简洁、易用...

    dwz开源web界面框架

    学习DWZ的建议 •通读DWZ文档,很多新手提的问题文档中都写了 •看demo每个组件演示效果和代码(留意组件html结构) •建议安装firebug,用firebug看html结构、CSS和调试JS都非常方便。见附录一 firebug介绍 •对于...

    DWZ帮助文档 PDF版

    DWZ富客户端框架是一种基于JavaScript的前端开发框架,它提供了一套丰富的UI组件和扩展功能,旨在简化Web应用程序的开发流程。DWZ框架具备良好的兼容性、模块化和扩展性,能够帮助开发者快速构建具有丰富交互功能的...

    DWZ富客户端框架dwz-ria-1.4.6

    DWZ富客户端框架dwz-ria-1.4.6是一款专为开发高效、美观的Web应用程序而设计的后台框架。这款框架集成了多种技术,旨在简化开发过程,让开发者无需深入理解AJAX和jQuery等复杂技术,也能快速构建出与专业级应用相...

    dwz demo按列

    【DWZ 框架与Java Web开发】 DWZ(Design for Web Zen)是一个基于Ajax技术的开源JavaScript框架,主要用于构建富互联网应用(RIA)。它提供了丰富的UI组件、高效的Ajax交互以及优雅的页面布局,旨在简化Web开发...

Global site tag (gtag.js) - Google Analytics