dbnetgrid学习.doc

说明：该文档是通过对值班记录和合同管理页面的修改中总结出来的学习记录，主要记录了对dbnetgrid的学习心得。对该技术的学习尚不完全，以后会进行进一步完善，每次完善将直接在该文档中进行修改。dbnetgrid和dbnetedit的载入1、dbnetgrid载入方法2、dbnetedit载入方法在项目中dbnetgrid和dbnetedit都可用一种通用的载入方法。var dbnetgridUrl = /dbnetgrid/htc/dbnetgrid.htc;var dbneteditUrl = /dbnetedit/dbnetedit.htc;var localurl=getReqURL()function grid_init() dbnetgridUrl = localurl + dbnetgridUrl;dbneteditUrl = localurl + dbneteditUrl;var grid = document.getElementsByTagName(DIV); for(var i=0;igrid.length;i+) if (grid(i).id != undefined) if (grid(i).id.substr(0,9)=dbnetgrid) grid(i).addBehavior(dbnetgridUrl); if (grid(i).id.substr(0,9)=dbnetedit) grid(i).addBehavior(dbneteditUrl); 这种方法通常用于dbnetgrid和dbnetedit并存的页面中。方法在/pmis/app/js/common/common.js文件中可以找到。一、dbnettable初始化window.onload = init1、主grid的初始化function init() with (document.all.dbnettab1) tabs = tab1, 交接, dbnetgrid_zbMain, , tab2, 操作项目, dbnetgrid_zbjl, , tab4, 交班事项, dbnetgrid_jbsx, , tab5, 本班异常情况, dbnetgrid_bbycqk, , tab6, 交接班地线, dbnetgrid_jjbdx, , tab3, 定期工作, dbnetgrid_dqgz, onPageLoaded = initialiseloadTab()onPageLoaded将页面截入。页面中用一个层，使用样式表中的behavior属性，创建一个dbnettable对象，id为dbnettable，即名为dbnettab1。每一行数组都应有四个元素。第一个元素：为该dbnetgrid取一个名字标识，相当于dom中的name。如，tab1。第二个元素：为该dbnetgrid取一个可以在页面上显示的名字，相当规模于dom中的value。如交接第三个元素：为该dbnetgrid设置一个标识，相当于dom中的id。如dbnetgrid_zbMain。第四个元素：设置dbnetgrid所要关联的另一个dbnetgrid。只有从grid可用，表明该grid所要关联的主grid。如，tabs = tab1, 过衡数据, dbnetgrid_qy, ,tab2, 详细数据, dbnetgrid_detail, dbnetgrid_qy 其中tab1就是tab2的主grid。2、从grid的初始化detailTab = tab1,dbnettab2,dbnettab2_init 第一行数组有三个元素。第一个元素：为该从grid所关联的主grid的name。第二个元素：为该从grid的id。如，dbnettab2。相当于再在jsp页面中添加一个第三个元素：为该从grid初始化页面函数。如dbnettab2_init。相当于onPageLoaded = dbnettab2_init。在下面可以用document.all.dbnettab1.currentTab.id来取出当前tab的id，如tab1。3、grid选项卡初始化setTabProperty(tab1, onshow:grid1Load)setTabProperty(tab2, onshow:grid1Load)setTabProperty(tab3, onshow:grid1Load)第一个参数：所要初始化的grid选项卡的name。第二个参数：所要初始化的grid选项卡的初始化函数。一般用onshow属性来调用。注：(1)所有的tab属性设置完毕后必须调用loadTab()来使所有tab设置生效。(2)只有在对tab选项卡进行选择后才会触发onshow属性所对应的函数。例：setTabProperty(tab1, onshow:grid1Load)setTabProperty(tab2, onshow:grid1Load)setTabProperty(tab3, onshow:grid1Load)setTabProperty(tab4, onshow:grid2Load);function grid1Load() var grid1 = document.all.dbnetgrid1switch(document.all.dbnettab1.currentTab.id) /正式物资case tab1:/临时物资case tab2:/禁用物资case tab3:4、自定义grid上述创建grid的方法是先创建一个tab再在tab中添加grid，这样在未创建tab前grid是不存在的。如果要在创建tab之前就要使用grid中的一些函数，如：selectData，那么需要在jsp页面下方创建一个单独的grid。如，、二、dbnetgrid常用属性1、integration属性dbnetGrid新版本才有的新属性，表示交接班、操作项目、交接事项、本班异常情况、交接班地线、定期工作等页面全部一次集成到值班记录的主页面中。如果在新版本中不使用integration属性，则会在页面中以蓝色背景显示不正常的内容。2、displayToolbar属性显示pageToolbar。为true时不显示，默认为true。3、对数据库进行操作的属性通常一个数据表的查询语句为select * from table_name as other_name where xxx=xxx and xxx = xxx；dbnetgrid则将类似的语句进行分解，分解出的每一部分都可以用相应的属性来进行操作。fromPart属性：相当于SQL语句中from后的语句，一般为表名、或视图名。primaryKeyColumn属性和primaryKeyColumnType属性：表中主件字段和主件字段的类型。selectPart属性：相当于select后的语句，一般为表的字段名。headings属性：相当于as后的语句，一般是为字段名取的别名，在dbnetgrid中可显示在页面中。如，,禁用,编码,品名,规格型号,单位,库存单价,库存数量,仓库。这是一个例外，在页面中第一个元素可以checkbox复选框来显示。joinPart属性：相当于where后的连接语句，用于对两个有主外键关系的表进行关联。如：joinPart = JYGL_HTGL_HTGK.HTH = XB.HTH(+)。fixedFilterPart属性：相当于where后的条件过滤语句，用于给所查询的表进行条件约束，找出符合条件的信息。4、edit类型属性editSections属性如：editSections = , 4, 100%, , 6, 90%, , 1, 90%, , 1, 90% ;第二层中，第一个字段：未知；第二个字段：修改框中所显示的元素可以分成的最大行数；第三个字段：每行所占区域的百分比。editSectionsField属性如：editSectionsFields = JL_TYPE,BH,XH,PID,RQ_FACT,RQ,ZC_NAME,JL_TIME,ITEM_ID,XJ_NAME, JL_CONTENT, BZ ;与上面的editSections属性相对应，,4,100%该区域可分为四行显示。5、editDialogCloseOnApply属性值为true时,在保存数据时不会返回。如果为false则返回浏览页面。在新版本中该属性不起作用。6、pageInfo属性当pageInfo=false时，pageToolbar上的项目全部变黑了。7、orderColumn属性需要进行排序的字段。一般与orderSequence一起用，orderSequence用于设定刚进入页面时是desc还是asc。orderColumn可以指定需要进行排序的列，orderColumn指定该列在页面载入之初是以什么样的顺序进行排序的。默认为asc，设置为desc则由大到小排序。document.all.dbnetgrid1.orderColumn = regiondocument.all.dbnetgrid1.orderSequence = desc8、dataOnlyColumns属性添加到dataOnlyColumns属性中的字段，在以后都可以通过currentRow来进行直接调用，并返回字段中相应的值。如：dataOnlyColumns = JL_TYPE,BH,XH,PID,RQ_FACT,RQ,ZC_NAMEint row = grid.currentRow;var type = row.jl_type;9、copy、help、sort、print属性针对pageToolbar中的元素，为true即显示。10、dateFormat属性格式化日期。如：dateFormat=y-m-d h:mi;在浏览页面中就会显示出时分秒来。默认情况下只显示年月日。11、editNavigation属性在修改页面中控制下方的滚动器是否可用，滚动器可用时，直接通过该滚动器跳到上一行或下一行进行修改。为true时滚动器可用。默认为false，滚动器不显示。12、insertRow属性在浏览页面中显示新建行按钮，默认为true。13、search属性在pageToolbar中显示“打开查询对话框”按钮，默认为true。14、deleteRow属性在pageToolbar中激活删除行控件，为true时激活，默认为true。控制不好，将会删除所有记录。15、addRowIndex属性对浏览页面中的每条记录按顺序编号。为true时显示编号，默认为false。16、editRowInitialisation属性editRowInitialisation=lileijjbdx，表明点击修改行按钮后或者双击该行后，都会进入相应行的编辑页面，editRowInitialisation属性定义的函数可以设置对随后进入的编辑页面进行初始化。lileijjbdx为进行该操作的函数。17、addRowDeletion属性显示每行末的删除控件，为true时显示该控件，默认为false。使用不好也会删除所有记录。18、multipleInsert属性支持多行插入。当属性为true时，可以一直在新建面板在进行多次插入操作，每次插入完成后都会将面板中的数据清空，方便下次输入。当属性为false时，如果执意要在新建面板中进行多次插入，也会提示插入成功，但在浏览页面中只会显示最后一次插入的信息。默认为false。19、optimisticLocking属性当一个用户业务没有完成，只要这个业务涉及到修改该记录，另一个用户就无法修改该记录，这叫乐观锁策略。如果有其他用户修改该记录就会提示：信息已经被其他用户修改过。将optimisticLocking属性置为false就会撤销乐观锁策略。默认为true。20、showEditOnLoaded属性是否在浏览页面中显示编辑面板。为true则显示，默认为false。还可以不显示记录，只显示该记录的编辑面板。onPageLoaded = tobeInsert;function tobeInsert()document.all.dbnetgrid_worksheet.navibar.toggleGrid() 21、saveAndReturn属性属性为true时，新建面板中的返回按钮消失，每次提交新数据后就会返回到浏览页面。默认为false。22、pageMenu属性在pagetoolbar上的最右侧显示一个菜单，可选择操作。pageMenu是一个二维数组。第一维(外维)：用来表示所要显示的菜单项。第二维(内维)：用来表示每个菜单项中的属性。通常有三个元素。第一个元素为菜单项的编码，为树型编码，可以构成子菜单项；第二个元素为菜单项的标识，方便后面对菜单项进行调用；第三个元素表明菜单项的所属，通常表示该菜单项属于哪个grid。如：pageMenu = 11,insertformmodel,dbnettab_list.tab_list, 12,insertdh,dbnettab_list.tab_list, 1201,insertdh1,dbnettab_list.tab_list, 1202,insertdh2,dbnettab_list.tab_list pageMenu对应menuActions属性。menuActions也是一个数组数型，通常为二维数组。第一维(内维)：用于存储所有菜单的行为。第二维(外维)：用于存储单个行为的属性。通常有两个元素。第一个元素为点击该菜单项后会触发的行为对应的函数；第二个元素为该菜单项的名字。如：menuActions = new Array()menuActionsinsertformmodel = buttonNewClicked,典型和历史票menuActionsinsertdh = ,创建附票menuActionsinsertdh1 = buttonNewDh1Clicked,一级动火票menuActionsinsertdh2 = buttonNewDh2Clicked,二级动火票23、filter属性filter = true，引进过滤机制。24、asyncLoad属性为false时，在页面载入过程中的那段停顿时间中页面会显示Loading Grid.please wait message 以提示用户页面尚未载入。为true时，可以再使用asyncLoadMessage属性自定义提示信息或者用onBeforePageLoaded属性自定义页面载入前执行的小操作。默认时为false，具体细节见文档。25、deleteValidation属性删除的有效性判断，值为函数名柄。函数返回true则可删除，返回false不可删除。具体操作见自定义函数中的grid1DelVaild。26、editDialogInitialisation属性对修改面板中的一个修改框进行的操作，值为一个函数够本，操作流程在函数中进行。传递的参数仍为editControl。27、onRowSelected属性选择一行记录后所触发的操作。如：onRowSelected = selectedChange;function selectedChange() var grid = document.all.dbnetgrid_rchy;var state = grid.selectData(select bill_state value from fuel_swgl_mzfx where bh = + grid.currentRow.bh + );document.all.dbnetgrid_rchy.updateRow = falseif(user_type = hysh)if(state.value & state.value = 2)document.all.dbnetgrid_rchy.updateRow=trueelsedocument.all.dbnetgrid_rchy.updateRow=falseelse if(user_type = hyy)if(state.value & state.value = 1)document.all.dbnetgrid_rchy.updateRow=trueelsedocument.all.dbnetgrid_rchy.updateRow=false28、updateRow属性使页面上的所有记录处于可编辑状态。默认为true。29、actionTable属性dbnetgrid对象所对应的面板，即对应的页面容器。通过appendChild函数可往上面添加各种函数。并可对actionTable进行如下操作。如，actionTable.appendChild(button);actionTable.style.textAlign = center;在该grid容器中添加button按钮。并将容器的样式设成居中。也可以用如下的方法来添加按钮，方法很多，要会活用。actionTable.style.textAlign = centeractionTable.insertAdjacentHTML(beforeEnd,保存)注：(1)所有属性设置完毕后必须再调用loadData()来使所有属性生效。30、onEditApply属性在编辑页面中点保存提交后触发的事件。例：onEditApply = editApplied;function editApplied() var grid = document.all.dbnetgrid_zb;var parameters = new Object();parametersp_bh = grid.editControl.inputControl(bh).value;parametersp_type = unit_type;parametersp_pid = ;parametersp_rq = grid.editControl.inputControl(rq).value;document.all.dbnetedit_elec.selectData(PKG_YXGL.jldljbyqdlb, parameters);31、rowValidation属性如：rowValidation = RQValidation在编辑面板中点击保存按钮会触发rowValidation属性所对应的函数，函数返回true则保存成功，返回false则会保存失败。传递的参数为field。如RQValidation(field)。function RQValidation(field) var grid = document.all.dbnetgrid_zb;var sql = select count(*) value from SC_YX_REPORT_ELEC_ZB where to_char(rq,yyyy-mm-dd)=+ field.value + and UNIT_NUM= + unit_name + ;var count = grid.selectData(sql);if (count.value 0 ) field.msg = 该日期的记录已经存在，请更改日期;return false;return true;也可以传递参数editControl，如function rolesRowCheck(editControl) var rolescode = editControl.inputControl(rolescode).value var validationrole = rolescode.substr(0,typecode.length) var re = / /g; var replacerole = rolescode.replace(re,) if (validationrole = typecode & replacerole.length typecode.length ) return true else editControl.msg = 角色编码必须以 + typecode + 开始,且长度大于 + typecode.length editControl.activeControl = editControl.inputControl(rolescode) return false 32、rowDblClick属性是否屏蔽行点击事件。如果属性值为false则无法触发行点击事件，默认为true。如果rowDblClick为false则无法双击进入编辑页面。33、filterPart属性再次过滤，也与where条件语句相当。与fixedFilterPart作用相同。34、save属性save值为true时在页面右上角会出现一个下载按钮，将页面保存为excel文件。35、insertValidation属性点击添加按键时触发的事件。如：insertValidation = checkSheetInsert;function checkSheetInsert() var grid = document.all.dbnetgrid1;if(grid.pagetoolbar.all.second_menu.value = no_limit) alert(必须先确定设备名称，才可以添加记录！请在级联菜单上选择设备名称！);return false;35、customSelectedStyle属性customSelectedStyle = mySetRowStyle;function mySetRowStyle(row, grid) /flag为false时，表示设置选中的行的样式，为true时，表示恢复原本样式var flag = (row = grid.currentRow) ? true : false/以下例子演示了给选中的行加上边框var css = flag ? : 2px solid blue;row.cells0.runtimeStyle.borderLeft = cssfor (i=0;irow.cells.length;i+) if (flag) row.cellsi.runtimeStyle.borderBottom = 1pt solid #ccccccrow.cellsi.runtimeStyle.borderTop = none else row.cellsi.runtimeStyle.borderBottom = cssrow.cellsi.runtimeStyle.borderTop = cssrow.cellsrow.cells.length-1.runtimeStyle.borderRight = css36、onDeleteApply属性删除记录后所触发的事件。onDeleteApply = refreshTree;function refreshTree() window.parent.frm_tree.location.reload()删除记录后，功能树重新刷新。37、rowCount属性统计grid页面中记录的条数。三、dbnetgrid函数1、setEditColumnProperty函数如：(1)setEditColumnProperty(XJ_NAME, lookup:select code,username from user_list where code= + userid + )lookup属性：与setColumnLookup方法实现的功能相同，不同的是在修改框中实现的。删除该行后，修改页面中记录人那一项中显示SYS。该lookup属性还有另一种用法：setEditColumnProperty(WORK_STATE,lookup:0,未完成,1,已完成)0表示未完成，1表示已完成。参数以键值对的形式出现。(2)setEditColumnProperty(XJ_NAME, initialValue: + userid)initialValue属性:初始化时自动将userid的值写到XJ_NAME字段所对应的项目的文本框中，为false则文本框中的内容为空。(3)setEditColumnProperty(XJ_NAME, required:true)required属性：表明该项目是必须填写的。默认为false(4)setEditColumnProperty(XJ_NAME, editReadOnly:true)editReadOnly属性：控制XJ_NAME字段所对应项目在新建表单中是否可以修改，为true表明只读，不能修改。默认为false，可以修改。(5)setEditColumnProperty(RQ_FACT,format:y-m-d h:mi:s)format属性：对字段的值进行格式化，此处只对日期类型有效。默认为y-m-d。默认情况下在编辑页面的时间面板中只能显示年月日，例子中可以把时分秒也显示出来供用户选择。(6)setEditColumnProperty(BH,display:none)display属性：决定该字段所对应的项目在修改页面中是否显示，默认为显示。(7)setEditColumnProperty(JL_CONTENT,height:100)height属性：确定修改页面中该字段所对应项目的高度。(8) setEditColumnProperty(BZ,elementType:textarea)elementType属性：设置输入框的属性。textarea表示文本域。(9) setEditColumnProperty(RQ, validation: RQValidation)Validation属性：编辑值的有效性设置。对应的函数为function RQValidation(field)，有一参数field。返回true编辑值有效。field.msg来确定无效时的提示信息。(10)setEditColumnProperty(sybm,editLookup:select notes| decode(substr(groupid,1,1),1,（一期）,2,（二期）,) as value, notes| decode(substr(groupid,1,1),1,（一期）,2,（二期）,) as text from group_list where groupid 9 and is_con = 1)。(11) setEditColumnProperty(FLBM,onchange:flbmChange)如果flbm是一个下拉菜单，那么onchange属性后的函数flbmChange将会触发该下拉菜单的onchange事件。2、setColumnProperty函数如果其中第一个参数的值无法取得，则会在浏览页面中以桔红色的背景显示报错信息。如setColumnProperty:没有找到列SC_YX_ZBGL_JJBDX.ROWNUM.(1)setColumnProperty(RQ_FACT,width:120)width属性：字段在浏览页面中显示的宽度。该处为时间字段的显示宽度。(2)setColumnProperty(BH,display:none)display属性：决定字段中的值在页面中的显示。为none则不显示，默认为显示。(3)setColumnProperty(JL_CONTENT, ellipsis:50%)，ellipsis属性：设置指定列文字显示的宽度，如果内容超过该宽度，则显示为省略号。默认为不显示。setColumnProperty(JYGL_HTGL_HTGK.HTMC, ellipsis:160)，合同名称字段的内容只显示160个相素，如果超过160个相素，则显示为省略号。(4)setColumnProperty(selectParti,noWrap:true)noWrap属性：控制指定字段所对应项目中文字是否能换行，为true表明不能换行。默认为可以换行。(5)setColumnProperty(nvl(JYGL_HTGL_HTGK.MEMO_N1, 0)+nvl(xb.zj, 0), decimalPlaces:2)。decimalPlaces属性：合同金额字段项目的值在显示时为保留小数点后2位数。(6) setColumnProperty(seqnum,textAlign:center)。textAlign属性：设置字段的水平位置。(7) setColumnProperty(WZ_BM.CODE,modify:)。modify属性：显示一个控件。value=$，表明在运行时value将被替换成相应的值。3、setColumnLookup函数如：setColumnLookup(XJ_NAME, code, username, user_list)在页面中XJ_NAME对应的记录人，XJ_NAME是相对于表user_list的一个外件。记录人下的内容中，如果XJ_NAME为SYS则在表user_list中查出相应的描述，为系统管理员。code和username都是user_list的字段。删除该方法后浏览页面中记录人那一项显示SYS。如果别名不是从数据表中取得，而是由程序员自己设定，用于数量较少的转换。如，定期工作中完成状态字段的转换。当WORK_STATE为0时，显示未转换；为1时，显示已转换。此时就得用另一种办法：transform属性：参数为一函数的句柄。如，setColumnProperty(WORK_STATE,transform:cellTrans)function cellTrans(cell) if (cell.innerText = 0) cell.innerText = 未完成 else if (cell.innerText = 1) cell.innerText = 已完成另一例：setColumnLookup(DQGZ_UNIT,PROPERTY_CODE,PROPERTY_NAME,PROPERTY_CODE,true,type_name=定期工作周期)如果有六个参数，那么后面两个参数则为过滤参数。true，表明需要进行过滤。type_name对应property_code表中的type_name字段，相当于sql语句：select perty_code, perty_name from property_code t where type_name = 定期工作周期。4、selectData函数(1)第一个参数为SQL语句如：var dat = grid.selectData(select BM,PM,GG,DW,SL,DHSL,DJ,ZJ from JYGL_HTGL_HTBPBJQD where JYGL_HTGL_HTBPBJQD.hth = + htbh + , null, true)。selectData函数：后两个参数为null,true，表明返回一个对象数组。如果没有null,true，表明只返回一条记录的对象。(2)第一个参数为存储过程如：parametersp_bh = bh;parametersp_lsh = rtn;grid.selectData(PKG_YXGL.p_update_cells, parameters);如果存储过程需要传递参数，则参数部分将被封装成对象，并做为selectData的第二个参数。存储过程中的每一个参数都分别对应对象的每个属性。5、SetFormula函数在指定的单元格中设置并计算表达式。其中第四个参数为公式表达示，以字符串的形式表示，但该字符串必须为一个公式。如：SetFormula(2,11,1,str1)；var str1 = Format(+htje+,1)；Format函数中，第一个参数为数字，一般都是货币；第二个参数，1为中文货币大写,2为英文货币大写。6、getDateStr函数getDateStr()，返回两对input标签和img标签。第一对中input标签id为beginDate，用于接收开始时间；img标签对应一个datePopUp的onclick函数，用于传入开始时间到对应的input中去。第二对中input标签id为endDate，用于接收结束时间；img标签对应一个datePopUp的onclick函数，用于传入结束时间到对应的input中去。具体返回的内容见图图1getDateStr返回值getDateStr()中可以有参数，如getDateStr(31)表示初始的起始时间和结束时间相差为31天。7、setHeadingProperty函数设置heading属性设置的字段在页面中显示的位置。如：setHeadingProperty(textAlign:center)，就是页heading居中。8、addDetailGrid函数如，addDetailGrid(document.all.dbnetgrid2, , grid2Load)。该函数的作用是载入从grid的内容。第一个参数：所要添加从grid的id。第二个参数：需要关联的外键字段。第三个参数：添加该grid时所要进行的初始化函数。如：9、recordExists函数如，if(grid.recordExists(select 1 from wz_cjsxb where bm= + row.wzbm + )。该函数的作用是判断该sql语句能否返回数据。如果能返回数据则该数据存在，返回true。如果不能返回数据则该数据不存在，返回false。10、getRqStr函数返回一个时间输入面板。为一对input标签和img标签。具体返回内容见图2。图211、recordExists函数执行sql语句。如，var v_sql = delete from FUEL_DYGL_DYFX where pid = + gs_pid + and to_char(sj,yyyy-mm) = + v_date + and lx=30;document.all.dbnetgrid_dy.recordExists(v_sql);可将记录删除。12、GRID_PTS函数GRID_PTS (groupID,notes,group_list,BMMC,1=1)。通常在fromPart中使用，和setColumnLookup的作用相似。第一个参数：初始值，也是待转换的值，对应的字段。字段属于第三个参数中所涉及的表。第二个参数：转换后的值，对应的字段。字段属于第三个参数中所涉及的表。第三个参数：转换时所要参照的数据表。第四个参数：转换后的值的标识。第五个参数：转换查表时所需的条件。四、接口自定义属性1、filterCell如，filterCell = pagetoolbar.all.toolbar.rows0.insertCell()；filterCell.innerHTML = getDateStr() +  查询;该语句可以在pagetoolbar旁边添加一个cell元素。然后通过innerHTML对该元素进行控制。可添加菜单或者按钮等控件。在以后的语句中并可以继续对filterCell属性进行操作，以达到既定目的。如，filterCell.style.display = none。可将通过该属性定义的控件的状态设置为不显示。2、button如，var button = document.createElement(BUTTON)创建一个button控件。并且通过变量button可对该控件进行各项操作。如，button.innerText = 确定button.id = okbutton.onclick = doSubmitbutton.className = pageBtn五、接口自定义函数1、editRowInitialisation属性对应的函数function lileijjbdx(editControl)详解该函数在进入新建或修改面板时都