码迷,mamicode.com
首页 > 其他好文 > 详细

DWZ框架搭建 以及使用

时间:2014-12-08 10:46:27      阅读:265      评论:0      收藏:0      [点我收藏+]

标签:dwz框架搭建 以及使用

1.搭建框架


1.1. 搭建框架首先需要官网下载框架代码,全都是js文件,图片文件 之类的。

bubuko.com,布布扣

1.2  使用方法可以登录 http://www.j-ui.com/ 网


通过官网演示找到功能 找到页面

1.3 搭建框架 只需要把资源放到对应项目里面,页面上加载对应资源即可,页面模板 可从DWZ资源里找到

bubuko.com,布布扣

2.DWZ标签概念   target标签

navTab :打开新页面

ajaxTodo:是一个ajax请求

bubuko.com,布布扣

ajax请求的情况下  刷新id概念

rel 是刷新id:用于定义一个页面的标识,用于删除添加修改,找到列表页面刷新。

bubuko.com,布布扣

一般返回ajax  json 格式 都是可以在官网demo里找到  】

bubuko.com,布布扣

3.session过期  处理

可以选择弹出框或者,直接跳到登录页面 可以后台index里设置

$(function(){
    //alert(2);
    DWZ.init("/ui/dwz.frag.xml", {
        loginUrl:"/admin/logindialog", loginTitle:"登录",    // 弹出登录对话框
        //loginUrl:"/admin/login",    // 跳到登录页面

        statusCode:{ok:200, error:300, timeout:301}, //【可选】
        pageInfo:{pageNum:"pageNum", numPerPage:"numPerPage", orderField:"orderField", orderDirection:"orderDirection"}, //【可选】
        debug:false,    // 调试模式 【true|false】
        callback:function(){
        //    alert(1);
            initEnv();
            $("#themeList").theme({themeBase:"/ui/themes"}); // themeBase 相对于index页面的主题base路径
        }
    });
});


4.分页信息处理

$(function(){
    //alert(2);
    DWZ.init("/ui/dwz.frag.xml", {
        loginUrl:"/admin/logindialog", loginTitle:"登录",    // 弹出登录对话框
        //loginUrl:"/admin/login",    // 跳到登录页面
        statusCode:{ok:200, error:300, timeout:301}, //【可选】
        pageInfo:{pageNum:"pageNum", numPerPage:"numPerPage", orderField:"orderField", orderDirection:"orderDirection"}, //【可选】
        debug:false,    // 调试模式 【true|false】
        callback:function(){
        //    alert(1);
            initEnv();
            $("#themeList").theme({themeBase:"/ui/themes"}); // themeBase 相对于index页面的主题base路径
        }
    });
});

已经在这里开始设置参数的意思

只需要通过隐藏表单处理就行

<input type="hidden" name="pageNum" value="${pageNum}" />
  <input type="hidden" name="numPerPage" value="${numPerPage}" />


页面尾部分页

<div class="panelBar">
        <div class="pages">
            <span>显示</span>
            <select class="combox" name="numPerPage" onchange="navTabPageBreak({numPerPage:this.value})">
                <option value="20" <#if (numPerPage==20)>selected="selected"</#if>>20</option>
                <option value="50" <#if (numPerPage==50)>selected="selected"</#if>>50</option>
                <option value="100" <#if (numPerPage==100)>selected="selected"</#if>>100</option>
                <option value="200" <#if (numPerPage==200)>selected="selected"</#if>>200</option>
            </select><span>条,共${totalCount}条</span>
        </div>
        
        <div class="pagination" targetType="navTab" totalCount="${totalCount}" numPerPage="${numPerPage}" pageNumShown="10" currentPage="${pageNum}" ></div>
    </div>


DWZ框架搭建 以及使用

标签:dwz框架搭建 以及使用

原文地址:http://blog.csdn.net/huchunbin/article/details/41799713

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!