• 刷新下拉列表的值

    概述

    刷新下拉列表的值,需要先获取下拉框这个对象,获取方式为 window.表单ID + "_" + 文本框ID。

    比如 下面这个表单中的性别选择器的勾子名称为window.sUserAdd_xb

    <form id="sUserAdd">
    <table border="0" cellpadding="0" cellspacing="12" class="c12">
        <tr>
            <td>性别:</td>
            <td>
                <input id="xb" type="text" class="cselector" mode="xb"/></td>
        </tr>
    </table>
    </form>

    使用方法

    使用勾子对象的refresh函数,此函数没有参数,所以需要自行处理更换逻辑,再调用此函数。比如

    function aa(){

     $("#xb").attr("mode","yesno");

     window.sUserAdd_xb.refresh();

    }

  • zjs.cform

    概述

    zjs.cform有两种用法,一种用于添加、修改之类的后台管理。一种用于表单渲染前台显示。一般不需要手动调用,uiZjs会自动调用此函数。但是有些特殊API可能会使用到,zjs.cform的主要勾子是以form表单的id访问此表格对象,规则为window.cform+表格ID。比如<form id="productinfo"…… 那么此表格的对象名称为window.cformproductinfo,使用对象名称,可以访问到对象的属性和方法。比如获取表单当前要显示的数据对象、手动调用表单检验等等。

    属性

    使用对象名称 如window.cformproductinfo可以访问到对象的所有属性,具体属性如下:

    属性名称
    属性意义
    window.cformproductinfo.Data
    当前表单将要渲染的数据对象,返回一个对象 如{"name":"姓名","sex":1}

    方法

    使用对象名称 如window.cformproductinfo可以访问到对象的所有方法,具体方法如下:

    属性名称
    属性意义
    参数
    window.cformproductinfo.search
    发起搜索
    searchpara 为对象类型的参数 本身可带多值 比如{"id":"1","name":"张三"}
    window.cformproductinfo.render
    重新渲染表单

    无参数 需要先调用.Data给表单数据重新赋值 然后直接调render即可

    比如:

    window.cformproductinfo.Data={"id":"2","name":"李四"};

    window.cformproductinfo.render();

    window.cformproductinfo.validator
    检验表单元素
    无参数 返回值为true或false 表单内所有元素都通过rule检验就返回true


    事件

    zjs.cform提供了几个常用事件,比如渲染前/后,如果需要使用请在form标签里增加对应事件的处理函数,具体方法如下:

    事件名称
    事件意义
    示例
    beforerender
    渲染前事件 比如在渲染前需要处理 一些字典转换

    <script type="text/javascript">

    function mybeforerender(){//自定义函数

    for循环window.cformproductinfo.Data此变量 处理某一个字段值 此处不再详述

    };

    </script>

    <form id="productinfo" beforerender="mybeforerender()" ……

    getcallback
    渲染后事件

    setcallback
    点击提交按钮 返回成功后执行的事件 一般用于关闭对话框等 *注close()为公共关闭对话框函数
    <form id="productinfo" setcallback="close()"




  • zjs.ctable

    概述

    zjs.ctable是表格渲染用的函数,但是一般不用调用,uiZjs会自动调用此函数。但是有些特殊API可能会使用到,zjs.ctable的主要勾子是以table表格的id访问此表格对象,规则为window.ctable+表格ID。比如<table id="productlist"…… 那么此表格的对象名称为window.ctableproductlist,使用对象名称,可以访问到对象的属性和方法。比如获取表格当前要显示的数据集合,获取表格数据集的总行数,总页数等等。

    属性

    使用对象名称 如window.ctableproductlist可以访问到对象的所有属性,具体属性如下:

    属性名称
    属性意义
    window.ctableproductlist.Data
    当前页将要渲染的数据集合 是一个数组 *注 仅当前页的数据
    window.ctableproductlist.Datas
    当前表格内缓存的所有数据,默认uiZjs会缓存100页数据,供前端翻页的搜索
    window.ctableproductlist.Datas1
    扩展项 如果表格带回来的数据集多于1个 会存在此处 供自定义处理
    window.ctableproductlist.Datas2
    扩展项 同上 场景比如 设置用户权限 返回的Datas为所有权限 Datas1为当前用户权限 自定义处理时 就可以使用Datas1对比Datas 而判断用户对应的权限要显示增加或者删除按钮
    window.ctableproductlist.TotalRows
    表格的总行数
    window.ctableproductlist.TotalPages
    表格总页数

    方法

    使用对象名称 如window.ctableproductlist可以访问到对象的所有方法,具体方法如下:

    属性名称
    属性意义
    参数
    window.ctableproductlist.dosearch
    发起搜索 如果数据都在前端 就在前端搜索 如果不是 就发到服务端处理

    window.ctableproductlist.search
    强制直接发起服务器端搜索
    searchpara 为对象类型的参数 本身可带多值 比如{"id":"1","name":"张三"}


    事件

    zjs.ctable提供了几个常用事件,比如渲染前/后,如果需要使用请在table标签里增加对应事件的处理函数,具体方法如下:

    事件名称
    事件意义
    示例
    beforerender
    渲染前事件 比如在渲染前需要处理 一些字典转换

    <script type="text/javascript">

    function mybeforerender(){//自定义函数

    for循环window.ctableproductlist.Data此变量 处理某一个字段值 此处不再详述

    };

    </script>

    <table id="productlist" beforerender="mybeforerender()" ……

    getcallback
    渲染后事件




  • zjs.getvals

    zjs.getvals为字典代码转换为值的函数,上一章里提到uiZjs提倡使用字典定义key/value的数据,那么key/value的转换就是由zjs.getvals函数处理的。

    概述

    zjs.getvals为字典代码转换为值的函数,上一章里提到uiZjs提倡使用字典定义key/value的数据,那么key/value的转换就是由zjs.getvals函数处理的。

    参数

    zjs.getvals有二个参数,参数如下:

    属性名称
    属性意义
    必传
    codename
    字典名称 比如 sex yesno 不需要带zjs.

    value
    要转换的值 比如1 2

    返回值

    返回值 为转换好的字符串 比如 男 女 是 否

    示例

    zjs.sex = "1|男,2|女";
    alert(zjs.getvals("sex","1"));

    执行一下试试


  • zjs.getQueryStr

    概述

    zjs.getQueryStr为获取URL里的参数,返回值为一个{}对象,对象的属性为参数名,属性值为参数值。比如URL为/?a=1&b=2&c=3那么zjs.getQueryStr得到的值为{"a":1,"b":2,"c":3}

    参数

    zjs.getQueryStr没有参数。

    返回值

    返回值 为对象 如{"a":1,"b":2,"c":3}

  • zjs.tree

    概述

    zjs.tree为树渲染,树渲染函数要求数据是树形结构,比如id pid的结构。一般pid以0为根节点。渲染后的结构为一个ul li嵌套的HTML结构,没有+-号,只有可表示的缩进结构。具体样式可以自行定义。

    参数

    zjs.tree有六个参数,参数如下:

    属性名称
    属性意义
    必传
    data
    要渲染的数组数据对象
    比如[{"name":"张三","id":1,"pid":0},{"name":"李四","id":2,"pid":0},{"name":"王五","id":3,"pid":1},{"name":"赵六","id":4,"pid":3}]

    pid    
    根节点的值 一般是以0为根节点

    template
    要渲染的树节点模板 比如<li id="{{id}}">{{name}}</li>

    idkey
    主键字段的名称 比如实例中的id 菜单一般叫menuid 角色一般叫roleid

    pidkey
    父字段的名称 比如实例中的pid或者parentid

    deep
    默认深度 一般默认从1开始 树深度自动延伸

    返回值

    返回值 为拼接好的字符串

    示例

    var my=[{"name":"张三","id":1,"pid":0},{"name":"李四","id":2,"pid":0},{"name":"王五","id":3,"pid":1},{"name":"赵六","id":4,"pid":3}];
    zjs.alert(zjs.tree(my,0,'<li id="{{id}}"><i class="icon-user"></i>{{name}}</li>',"id","pid",1));

    执行一下试试


  • zjs.render

    概述

    zjs.render为数组渲染函数,用于处理数组对象转换为HTML,一般常规的字符串处理方式为字符串的拼接,效果非常不好,会产生一堆引号加号等等。使用zjs.render函数的话,类似AngularJS的语法。使用{{变量名}}这种方式将变量绑定到对应位置,可以是任意正常HTML的位置,比如class style src 文本等等。

    参数

    zjs.render有三个参数,参数如下:

    属性名称
    属性意义
    必传
    data
    要渲染的数组数据对象 比如[{"name":"张三","logo":"/n.jpg"},{"name":"李四","logo":"/n.jpg"}]

    render
    要渲染的HTML模板 比如<div class="myinfo"><img src="{{logo}}" /><h6>{{name}}</h6></div>

    dateformat
    格式化的字符串 年使用yyyy 月使用MM 日使用dd 小时使用hh 分钟使用mm 秒使用ss

    返回值

    返回值 为拼接好的字符串

    示例

    var my= [{"name":"张三","logo":"/n.jpg"},{"name":"李四","logo":"/n.jpg"}];
    zjs.alert(zjs.render(my,'<div class="myinfo"><img src="{{logo}}" style="height:32px;"/><h6>{{name}}</h6></div>'));

    执行一下试试


  • zjs.renderRow

    概述

    zjs.renderRow为单行渲染函数,用于处理对象转换为HTML,一般常规的字符串处理方式为字符串的拼接,效果非常不好,会产生一堆引号加号等等。使用zjs.renderRow函数的话,类似AngularJS的语法。使用{{变量名}}这种方式将变量绑定到对应位置,可以是任意正常HTML的位置,比如class style src 文本等等。

    参数

    zjs.renderRow有三个参数,参数如下:

    属性名称
    属性意义
    必传
    datai
    要渲染的数据对象 比如{"name":"张三","logo":"/n.jpg"}

    render
    要渲染的HTML模板 比如<div class="myinfo"><img src="{{logo}}" /><h6>{{name}}</h6></div>

    dateformat
    格式化的字符串 年使用yyyy 月使用MM 日使用dd 小时使用hh 分钟使用mm 秒使用ss

    返回值

    返回值 为拼接好的字符串

    示例

    var my= {"name":"张三","logo":"/n.jpg"};
    zjs.alert(zjs.renderRow(my,'<div class="myinfo"><img src="{{logo}}" /><h6>{{name}}</h6></div>'));

    执行一下试试


  • zjs.dateformat

    概述

    zjs.dateformat为日期格式化,不同的列表可以显示不同的日期格式,比如2015/1/1或者12:33,如果这个日期序列化在服务端处理,那么每次修改列表,或者不同的展示时,都需要修改服务端代码。使用zjs.dateformat函数就可以把这个功能放到JS里处理,不需要每次都改代码。

    uiZjs里有一个默认规则,如果<i>标签有dateformat属性,会自动把 i 的值按照格式化处理。

    比如下面的代码:

    <i dateformat="yyyy-MM-dd">2015-04-13 12:33:21</i> 

    将会被处理成:
    2015-04-13 12:33:21

    参数

    zjs.dateformat有二个参数,参数如下:

    属性名称
    属性意义
    必传
    value
    时间的值 比如2015-04-13 12:33:21

    dateformat
    格式化的字符串 年使用yyyy 月使用MM 日使用dd 小时使用hh 分钟使用mm 秒使用ss

    返回值

    返回值 为格式化好的字符串

    示例

    var date = "2015-04-13 12:33:21";
    alert("yyyy-MM-dd格式:" + zjs.dateformat(date, "yyyy-MM-dd") + "  hh:mm格式:" + zjs.dateformat(date, "hh:mm"));

    执行一下试试


  • zjs.tips

    概述

    zjs.tips为短暂提示,在PC端,是对lhgdialog的二次封装,显示为一个对话框,在手机端,因为dialog过于庞大,所以在手机端只是显示了一个样式为zjstips的div,是一个简单的对话框。

    参数

    zjs.tips有三个参数,参数如下:

    属性名称
    属性意义
    必传
    message
    要显示的文本

    dindex
    要删除的元素的下标

    返回值

    void无返回值 数组为引用传递,删除完以后 原对象就没有了

  • zjs.removeArray

    概述

    zjs.removeArray为删除数组中的元素,这是个常用的数组操作代码的简单封装。

    参数

    zjs.removeArray有二个参数,参数如下:

    属性名称
    属性意义
    必传
    array
    要删除的数组

    dindex
    要删除的元素的下标

    返回值

    void无返回值 数组为引用传递,删除完以后 原对象就没有了

  • zjs.cmd

    概述

    zjs.cmd是常用的自定义命令处理函数,zjs.cmd实际是上对$.ajax的二次封装,并且对返回值进行系统级的统一处理。表单和表格实际调用的也是zjs.cmd命令。

    参数

    zjs.cmd只有一个参数,该参数为{}对象类型。对象有以下几个属性:

    属性名称
    属性意义
    必传
    cmd
    要执行的命令地址或命令名称

    para
    para为对象类型,执行命令的参数,该属性本身可以包含很多参数

    async
    同步还是异步 默认为异步true 同步请传false

    callback
    该属性为函数 执行成功后的回调 *注 只有在返回值ResponseID为0 也就是命令执行成功时 才会触发该函数

    示例

    zjs.cmd({
        cmd: "Demos_List",
        para: { "pageindex": 2, "pagesize": 5 },
        callback: function (data) {
            alert("我取到了留言版的第二页数据哟 共 " + data.TotalRows + " 条,在data对象里同样可以取到其他值。");
        }
    });

    执行一下试试


继续阅读

    uiZjs