XJawa:: 2002：7WX/AOP编程框架前端API文档

当前位置：首页

7wxAop开发框架

文档

目前：0 鲜花 0 牛粪我要：献鲜花扔牛粪

2002：7WX/AOP编程框架前端API文档

【关闭】

本站发布时间：2007年03月22日 20:48

概述：这是前端View部分的开发接口，愿版是txt文件（Word排版太累，人也懒）写的比较乱，这里稍微整理一下，成HTML格式(还是乱)

【附件:80027.txt】

7WX/AOP编程框架前端API文档
(2002-11-25 Leebai copyright-2002-deepsoft)

<1.表格 WebListView 封装部分>

1.功能：将二维数据（m行n列）显示成复杂的HTML表格、自动分页、多行选择；数据元素格式化；任意HTML区域
    （一般用div、span）的动态数据解析。

2.基本概念：7WX()元素
    2.1.7WX()元素是网页中的动态元素，整个网页显示给用户前，系统将这些动态元素全部转换成数据缓冲区buffer中
        的实际数据。该元素可以出现在网页中任何位置(表格<TD>、<DIV>、<INPUT>等等)，即可以作为页面要显示的
        数据，也可以作为HTML元素的属性值或样式表属性值。
    注意： a.<IMG>元素的src属性值中包含7WX()元素时，将<IMG>写成<XIMG>;
                b.样式表style的值中包含7WX()元素时，将style写成"Xstyle"。

    2.2.语法：7WX(变量名，转换函数) 或 {变量名，转换函数} 变量名是buffer中定义的变量名称。对于结果集产生
  的二维数组数据，变量名是下标列索引名，如“users_NAME”;对于单记录产生的简单字段变量数据，变量名就是
  字段变量名，如"user_NAME"。

    2.3.“转换函数”用于转换7WX()元素指定的数据，转换函数接收"变量名"指定的buffer中的数据，
        处理后返回实际使用的数据。转换函数前面带一个"*"号时，表示转换结果不但取决"变量名"指定的数据，
        还与该"变量名"指定变量所在的行的其他数据有关，这时转换函数还接收该行数据（一维数组），比如我们希望
        “显示人员列表时，如果年龄大于50，则在姓名前加#号”，则可以写成 7WX(users_NAME,*formatName),同时
        实现转换函数：
    function formatName(name,user){
     if(user[buffer.users_AGE]>50) return "#"+name;
     else return name;
    }
        系统已经定义了多个名为"Xformat..."的转换函数（见下），可以直接引用。用户自定义转换函数建议以
        "format"开头，建议一个项目的所有自定义转换函数统一放到一个format.js中，以便所有界面共享。

3.基本表格（不分页、不选择）显示：
    3.1.用标准HTML代码定义一个表格(只使用<TABLE>、<TR>、<TD>元素)作为"表格模板"，模板的最后一行是"模板行"，
        模板行之前有0或1或n行“表头行”（各列标题，一般1行，无表头者0行，复杂表头，如分类表头为多行），系统将
        如实显示表头行，不做任何解析。

    3.2.模板行的<TR>定义属性“style=display:none”；如果要给表行定义与该行数据相关联的显示样式（如某列值小于0
        的行背景颜色为黄色），请用前面所说的"Xstyle"，如　Xstyle="background-color:7WX(users_money,formatRowColor)"
    再实现转换函数 function formatRowColor(monney){return money<0 :"yellow" :"white";}

    3.3.在模板行的<TR>中，可以定义<TD>,可以在<TD>中、<TD>的属性中、<TD>中的HTML元素(如div、img等等，包括
        table，即嵌套表格)中、<TD>中的HTML元素的属性中使用7WX()元素来定义需要动态变换的数据。

    3.4.在请求数据的回调函数中，用函数 XfillTableWithArray(表格id,数组) 将数据显示到模板中。

3.5.如果想对系统数据绑定后的各行的HTML再做转换，则在 XfillTableWithArray()中传入第三个参数--转换函数，
  系统在每解析完一行数据后会回调该转换函数，并传入HTML及本行的序数（0,1,2...），转换函数转换后应返回结果HTML.

    3.6.示例：
       <table id=userstab>
   <tr><td>名字</td><td>性别</td><td>年龄</td><td>电话</td></tr>
   <tr style=display:none>
    <td>7WX(users_NAME)</td><td>7WX(users_SEX)</td><td>7WX(users_AGE)</td>
    <td>7WX(users_TEL)</td></tr>
   </table>
   ...
   XfillTableWithArray(userstab,buffer.users);

4.需要选择一行或多行进行处理的表格
4.1.在基本表格的基础上，模板行首列可以定义一个以下格式的单元格来支持行选中（单选用radio）:
   <TD><input type="checkbox" name="user" XobjectID=7WX(users_ID)></TD>
   其中name取二维数组数据名的"单数"，XobjectID定义为二维数组的关键字列对应的7WX()元素。
   ++++XhelpValue!

    4.2.以后在程序中如果要查看当前哪些行被选中，可以用 XgetTableSelectedLines(表格) 得到一个
        数组，每个元素对应一个选中行的关键字。如果想将这些选中关键字提交给后台程序，则可以使用
        XgetTableSelectedLinesURL(表格,URL变量名) 得到一个形如"id=1&id=6&id=5"的URL串。

    4.3.可以用 XsetAllTableLinesChecked(表格,boolean) 来全选或全不选表格行。

4.4.删除选中行时，在提交服务器的删除请求返回回调函数中，可以用 XdelTableSelectedLines(表格)
     来删除屏幕上的选中表格行。该功能不会导致重新分页，因此仅用于不分页的表格。

5.需要分页的表格
    5.1.如果表格要加分页控制条，则在<table>...</table>之前或之后加入代码：
   <SCRIPT>XinsertPageControl(每页默认行数)</SCRIPT>
    如果表格上面和下面都要有分页控制条，则在<table>...</table>之前加入上述代码，之后加入以下代码：
   <SCRIPT>XinsertPageControl1(每页默认行数)</SCRIPT>函数名最后为1(one) 行数和上面相同

5.2.分页控制表格的取数据不能用callServerGet/callServerPost,要用以下方法：
    a.先用 XsetAppAndAction(应用程序路径,取表格数据的action名)，相当于callServerXXX方法的前两参数
       b.再用 XnewQuery(查询URL或表单名,true)，相当于callServerXXX方法的第三个参数
      当查询条件改变，需刷新表格数据时，只需用 XnewQuery(查询URL或表单名,true)
    c.如果表格数据即不改变应用名和方法名，也不改变查询条件（如在某过滤条件下删除一条记录后重绘表格），则
    可以用Xrefresh()刷新表格。

5.3.分页数据取回后的回调函数中，除了正常的 XfillTableWithArray(表格id,数组) ,还要再加一行：
   XresetPageCtl(返回Buffer中结果集的总计数变量) 以更新翻页控制条

6.非表格页面区域的动态显示
    6.1.任何页面区域(如div、span等等)如果需要显示动态数据，也可以加入7WX()元素，要输出显示数据时用函数
        Xparse7WXWithRecord(htmlElement,arrRow)即可。如果buffer中的数据是SINGLE_SELECT出来的单
        单记录数据，则可以不指定arrRow；否则要用arrRow指定显示哪一行数据，如 users[0]。

7.系统定义的转换函数（也可用于表单封装）

文本内容到HTML内容  XformatContent()
　非空打勾,空不打勾   XformatNotEmptyToYes()
'true'打勾,其他不打勾  XformatTrueToYes()
long数据到年月日   XformatLongToYMD()
long数据到年月日时分  XformatLongToYMDHM()
long数据到月日时分  XformatLongToMDHM()
long数据到时分秒毫秒  XformatLongToHMSMs()
long数据到时分秒(时间长度，而非时间点,不超过30天)　XformatLongToHMS_()

[[[[[增补]]]]]
a1.用元数据产生表格模板：XmakeTableTemplate(tableID,arrayName,colNames,colLabels,colSizes,colTypeNames)
a2.有时某个id的表格其模板（整个table的HTML）可能需要更换，在更换模板后需调用XresetTable(‘表名’)。
a3.增加函数XfillTableWith2Array(tab,arr,rowCallBack,tabXid,arrX,rowCallBackX)，用于父子表的显示。
  限制：子表不可翻页、选择；父表对应数组的首列为父表的id，子表对应数组的首列为对应父记录的id。

8.语法总结：

<2.表单 WebFormView 封装部分>

1.功能：数据记录表单(form)或查询表单的自动字典获取及充填、自动数据输入限制和校验（焦点脱离时域校验，
即动态校验；整个表单提交前校验，整体校验）、修改记录时自动数据充填。

2.按HTML标准设计表单，要求每个输入域的name与数据库中表的列名一致(统一用小写)。
    2.1.对字典选择方式输入的域(select、checkbox、radio)，给HTML域元素扩充定义一个"Xdictionary"变量
        其值为字典表的"schema名,表名,id列的列名,标题列的列名,过滤条件,排序列名,数据源名"（最后的数据源名
  可选，如不指定，则使用默认数据源），如字典选用表中所有记录，则"过滤
        条件"为"1=1"，否则写符合 SQL-WHERE 标准的条件串，如"name like 'lee%'",串中可以使用AutoSQL
  语法，如“userID='{sessionvalue_UserId}'”。

  对于下拉框，如果希望实现联动功能，则"过滤条件"中可包含“{触发控件名}”，其含义为：下拉框初始为空，
  当触发控件的值变化，即onchange时，将用其值重新构成"过滤条件"从后端取数据并与下拉框绑定。(未实现)

  如果字典数据在动作请求的返回数据中已经包含（即返回
  数据中有与输入域同名的符合字典结构的数组），则只需定义Xdictionary=“1”。

2.2.对于checkbox、radio类型的字典，系统默认字典项之间纵向排列，如要横向排列，请定义扩充属性
     Xdirection=“1”。

    2.3.修改记录时服务器返回的字段数据自动充填到表单域之前，如果要对数据做变换，给HTML域元素扩充定义一个
        "Xformat"变量，其值为变换函数名(不加引号)。变换函数以域当前值为入参，以变换结果为返回值。

    2.4.在系统的基于数据库元数据的自动输入校验之外，如果要定义附加的输入校验，给HTML域元素扩充定义一个
        "Xvalidate"变量，其值为校验函数名(不加引号)。校验函数以域当前值为入参，如校验正确返回值为空串，
        否则返回值为校验错误信息。如果某域元素不需要参与系统的校验，则可指定属性XalwaysValid。

    2.5.表单作整体检验时，如某输入域有错，则提示”某某域“错，但数据库元数据中一般没有中文的”某某域“名称，
        这时为了友好地提示用户，应该给输入域扩充定义一个"Xlabel"变量，其值为字段的中文标签。

2.6.对于数据记录表单，如记录主键为后台自动产生，则定义主键域为hidden域；如记录主键为手工输入域，则定义
  扩充属性Xreadonly=1，这样编辑记录时该域将只读(新建时可写)。其他需要编辑时只读的域也可以使用扩充属性
  Xreadonly。能定义Xreadonly的域类型有input-text、input-password、textarea。

3.数据记录表单用于新建记录时增加以下代码：
3.1.在<BODY>的onload()中：callServerGet(应用名,‘取记录方法名’,‘id=-1&’+XgetFormDicsURL(表单名));

    3.2.在数据返回函数"on_取记录方法名()"中：XinitFormWithData(表单,数组名)；数组名为返回buffer中的数组
        名，前面不用带"buffer."，两边要引号。

    3.3.在数据提交前执行整个表单的校验：Xvalidate(表单)。

    3.4.如果表单用于查询..........

4.数据记录表单用于修改记录时增加以下代码：
    4.1.在<BODY>的onload()中：callServerGet(应用名,‘取记录方法名’,‘id=指定id&’+XgetFormDicsURL(表单名));

    4.2.返回数据充填及提交前校验同上面的第3点。

5.如果希望系统根据各数据库字段的宽度自动调节输入框的宽度，可在XinitFormWithData()之前调用
  XadjustControlSize()

6.语法总结：
     Xdictionary属性    字典域(select、checkbox、radio)定义，"schema名,表名,id列的列名,标题列的列名,过滤条件"
  Xformat属性        附加数据转换函数定义
  Xvalidate属性      附加校验函数定义
  Xlabel属性         字段校验提示标签

  XgetFormDicsURL(表单)函数        向服务器要字典数据的URL产生函数
  XadjustControlSize()   自动调节控件宽度
  XnoValidateOnBlur()    焦点离开域时不校验
  XinitFormWithData(表单,数组名)    新建或修改记录返回数据(字典、校验信息、记录数据)的自动充填。
  Xvalidate(表单)                  提交前对表单进行整体校验

<3.树组件 WebTreeView 封装部分>

1.功能：浏览器中的treeview组件，可以显示任意多级的节点，可动态增、删、改节点，增加子树，可以对节点进行多项选择。

2.定义树的宿主容器：
2.1.建议树的宿主容器为一个<DIV>元素，该<DIV>需要指定一个id，该id代表的<DIV>在编程中就等同于树。
2.2.为了让树充满整个容器、自动显示滚动条、去除文本选中，建议定义<DIV>容器的基本属性为：
  <div id=mytree onSelectStart="return false;" style="width:100%;height:100%;
  overflow:auto; font-size:14px;" ></div>

3.用节点数据初始化并显示树：
    3.1.树的每个节点的数据为一数组，元素0为父节点的id，元素1为节点的id，元素2为节点的显示名，
  元素3为节点的图标（可选。如无元素3或值为‘’则为默认图标；值为“-”为不显示图标；如指定图标，
  值应为一个url路径，相对路径、绝对路径均可，如“images/folder.gif”），4以后的元素系统未
  具体定义，用户程序可作它用。树的所有节点的数据构成一个二维数组,节点在数组中的顺序无要求。
  只有根节点的父id才能等于其自身id。

3.2.初始化并显示树，使用函数XinitTree(xtree,array,rootID,callback,expandCallback,
  expandLevel,selectable,defRootIcon,defNodeIcon,selectedIds)。参数含义：
  xtree：宿主容器的id
  array：所有节点数据的二维数组
  rootID：根节点的id
  callback：当用户点击节点时的响应函数，该函数接收一个节点数据nodeData参数。必须
  expandCallback：当用户展开或折叠节点时的响应函数，该函数接收一个节点数据nodeData参数。可为null
  expandLevel：初始打开的级数，根为0，打开显示第一层子节点为1，第二层子节点为2...。必须
  selectable：是否显示选择框，true或false。必须
  defRootIcon：指定用户默认的根节点图标的url，如为null，则使用系统默认的根节点图标。
  defNodeIcon：指定用户默认的节点图标的url，如为null，则使用系统默认的节点图标。
  selectedIds：初始被选择的节点的id列表，为一数组，如[‘node2’,'node5']。可选

  如： XinitTree(mytree,buffer.department,'0', onNodeClick,onNodeClick,2,false,null,null);

3.3.一旦XinitTree()被调用，宿主容器即成为一个树组件，用户程序可调用该组件的方法和属性来访问控制它。
     访问时，采用“宿主容器id.方法名(参数)（或属性名）” 或 “宿主容器id.属性名”的语法。

3.4.回调函数：
  应用程序可定义用户点击节点时的响应函数、用户展开或折叠节点时的响应函数。两个函数都接收一个
  变量参数，该变量代表节点的数据，如：

  function onNodeClick(nodeData){...}

  nodeData是一个数组，其基本数据与XinitTree()传入的节点数据一样，即nodeData[0]为父节点id，
  nodeData[1]为节点id，nodeData[2]为节点显示名，nodeData[3]为节点图标。

  nodeData中还包含其他一些有用的数据：
  nodeData[“subs”]：节点的所有子节点，为一数组，其中元素的数据结构同nodeData。
  nodeData[“level”]：节点所处的层次，根节点为0。
  nodeData[“expand”]：节点是否展开，为一布尔值。
  nodeData[“selected”]：节点是否被选中（仅适用选择型的树），为一布尔值。

  对nodeData数据，建议只读取，不写入。

3.5.可使用的方法：
  addNode(array,fid,img)：
   插入一个子节点，节点数据array要符合3.1的要求。fid是父节点的id，如不传fid参数或fid为null，则
   插入当前节点之下；img为节点图标url，如不传img参数或img为null，则系统使用节点数据array中指定
   的图标，如array中也未指定图标，则用系统缺省图标。若强制不显示图标，用‘-’。

  addNodes(array,fid,img)：
   插入一批子接点，节点数据array要符合3.1的要求。其他同addNode()。

  nodeToSubTree(node,subsArray)：
   插入一批接点到节点node，这些接点不一定全是node的子节点，而可以是孙节点及更低级节点，
   节点数据subsArray要符合3.1的要求。

  delNode(nodeID)：
   删除一个节点。

  refreshNode(nodeID)：
   重画一个节点。

  renameNode(nodeID,newName)：
   改一个节点的显示名(但不自动重画)。

  getSelectedNodes()：
   取（通过选择框）选中的一批节点，返回节点的id数组。

  getSubNodeIDs()、getSubNodeIDsAuto()：
   getSubNodeIDs()返回当前节点下的所有子孙节点的id列表，格式为“，id1,id2,id3...”。
   getSubNodeIDsAuto()自动判断当前节点是否展开，如展开，则返回getSubNodeIDs()的数据，
   否则仅返回当前节点的id。

  setCurrentNode(id)：
   设置当前节点（反显者）。

  cancelCurrentNode()：
   取消当前节点（反显者）。

  getNodeByID(nodeId)：
   取指定id的节点的节点数据nodeData（见 3.4 的 nodeData 的定义）。

<4.报表 WebReportView 封装部分>

1.功能：基于浏览器的报表打印功能。页面设计人员设计报表模板，后台程序员提供二维表格数据，前端程序员通过调用
  本API实现报表模板和报表数据的组合。

2.报表模板设计：
2.1.报表模板为一静态 HTML 文件，该文件打印预览时应适应于报表打印目标纸张的尺寸。
2.2.该 HTML 文件的 BODY 部分格式为：

  <BODY>      //BODY只能包含一个<div>元素，不能有其他任何元素，包括<br>
   <DIV>     //DIV只能包含三个<table>元素，不能有其他任何元素，包括<br>
    <TABLE></TABLE>  //报表的篇眉定义区 width="100%"
    <TABLE></TABLE>  //报表的表体定义区 width="100%"
    <TABLE></TABLE>  //报表的篇尾定义区 width="100%"
   <DIV>
  </BODY>

2.3.BODY必须定义属性onload="if(typeof(parent.templateok)!='undefined')parent.templateok();"。
2.4.DIV必须定义属性style="width:1400;height:940;overflow:hidden;border:1px solid #ddddff"。
  其中长宽数值根据报表的打印目标纸张大小调整，A3幅面为1400x940。通过实验确认显示尺寸没问题后，可以将
  DIV的border的宽度由1px改为0px。
3.5.表眉和表尾定义区内可以为任何html元素组合。
3.6.表体定义区的TABLE元素由n个表头行和m个数据行构成，TABLE必须定义属性XheadLines=n 指定表头行的行数
  （即<tr>数）。表头行的<td>内可以嵌套任何元素。数据行的<td>内全置0，不能嵌套任何元素，同时根据报表
  需要指定文本左右对齐，如<td align=right>0</td>。

3.前端程序员API:
3.1.对报表模板的调整：报表的表眉或表尾中如包含动态数据，则由前端程序员在模板中插入动态数据定义，格式为
  7WX(动态变量名)。如 <TD>填表单位：7WX(repunit)</TD>。
3.2.报表打印界面由已有的当前操作界面（一般为数据浏览界面）调用，调用前先访问服务器取回报表数据(数组名为
  statData)，在返回数据的回调函数中，执行 window.open('../../commonjs/printer.html?offset=
  打印起始列&template=' +escape('模板文件绝对路径'))，以打开报表页面，如：。

  function on_getStat_stat_01(){
   window.open('../../commonjs/printer.html?offset=1&template='+escape('tmp0.html'));
  }