calculategrid.htc

HTC,demo WEB用于。 超大型

      <!--///////////////////////////////////////////////////////////////////////
      // 标题：DBGrid组件 ///////////////////////////////////////////////////
      // 时间：2004-01-10 ///////////////////////////////////////////////////
      ///////////////////////////////////////////////////////////////////////-->
      <public:component name="DBGrid" urn="DBGrid">
      
      <public:property name="titleXML" get="getTitleXML" put="putTitleXML"/>//DBGrid标题数据源
      <public:property name="dataXML" get="getDataXML" put="putDataXML"/>//DBGrid数据源

      //grid组件整体位置、样式    
      <public:property name="top" value="10"/>
      <public:property name="left" value="10"/>
      <public:property name="width" value="200"/>
      <public:property name="height" value="250"/>
      <public:property name="borderColor" value="#666666"/> 

      //标题行样式/
      <public:property name="hasTitle" value="true"/> // 是否有表头
      <public:property name="titleBgColor" value="#cccccc"/>
      <public:property name="titleForeColor" value="#333333"/>

      //数据表样式
      <public:property name="dataBgColor" value="#dddddd"/>//数据表背景色
      <public:property name="oddTRColor" value="#ffffff"/> //数据表奇数行背景色
      <public:property name="evenTRColor" value="#ffffff"/> //数据表偶数行背景色
      <public:property name="selectionMode" value="cell" put="putSelectionMode"/>
      <public:property name="tableRow" get="getTableRow" put="putTableRow"/>//当前行
      <public:property name="tableCol" get="getTableCol" put="putTableCol"/>//当前列
      <public:property name="selectBgColor" value="#000000"/> //选择的cell或行的背景色
      <public:property name="selectForeColor" value="#ffffff"/> //选择的cell或行的前景色
      <public:property name="rows" get="getRows"/>//总行数
      <public:property name="cols" get="getCols"/>//总列数          
      <public:property name="PKColName" put="putPKColName"/>//每行的唯一标识列的列名
      
      //索引列样式      
      <public:property name="hasFixedCol" value="1"/>//是否有索引列：0：无 1：有
      <public:property name="fixedColForeColor" value="#000000"/>//索引列cell前景色
      <public:property name="fixedColBGColor" value="#cccccc"/>//索引列cell背景色
      <public:property name="fixedColAlign" value="center"/>//索引列cell对齐方式
      <public:property name="editMode" value="true"/>//是否可以编辑
      
      //是否有控制面板
      <public:property name="hasController" value="true"/>//是否有控制面板
      <public:property name="controllerBgColor" value="#ffffff"/>//控制器背景色
      <public:property name="pageSize" put="putPageSize"/>//一页记录数
      
      <public:property name="hasAddButton" value="true"/>//是否有增加行按钮
      <public:property name="hasDelButton" value="true"/>//是否有删除行按钮 
      
      //是否显示用于统计的页脚行
      <public:property name="hasPageFooter" value="true"/>//是否含有页脚行

      //checkBox列和radio列
      <public:property name="hasCheckBox" value="false"/>//checkBox列
      <public:property name="hasRadio" value="false"/>//radio列

      <public:property name="init" put="initialize"/>//组件初始化

      <public:event name="onDrag" id="evtOnDrag"/>
      <public:event name="onClickCell" id="evtClickCell"/> 
      <public:event name="onChange" id="evtonChange"/>

      <public:method name="getCellText"/> //获得指定cell的内容
      <public:method name="getSelectedXMLRow"/> //
      <public:method name="getValueByRPropName"/>//根据RPropName来获得指定行的列值
      <public:method name="delRow"/> //删除选定的行
      <public:method name="delCheckRow"/> //删除通过checkBox选中的行
      <public:method name="addRow"/>//添加新行  
      　　
      <public:method name="getXMLDocCopy"/>//返回当前正在编辑的xml的拷贝  原saveXML
      <public:method name="getXMLFrgWithRoot"/>//返回一般需要使用的xml结果对象  原saveXML2
      <public:method name="getXMLStringNoRoot"/>//返回一般需要使用的xml结果对象,无root节点  原saveXML3

      <public:attach event="onclick" for="element" onevent="hideInput()"/>

      <script language="JavaScript">
      
      <!--

        var oDataXML = null;//Table数据的XML对象
        var objDeletedXMLFragement = null;//用来保存已经删除了的行      
        var oCopyDataXML = null;//Table数据的XML对象的拷贝
        var oPreviousRowXMLData = null;//双击时用来保存当前行XML数据对象
        var oTitleXML = null;//Title数据的XML对象
        var oControl = null;//控制面板容器对象    
        var oDivPageFooter = null; 
        var oTabPageFooter = null; 

        var oTitle = null;//标题对象
        var oTitleTable = null;//标题table对象
        var oTitleTR = null;//标题行tr对象
        var oTitleTD = null;//标题cell对象
        var oTitleInnerDiv = null;//标题行 cell 中的 div 对象,用来撑开td
        var objTA,objDT,objSEC,objCombo,objActiveEditor,objMaskEdit,objDatePicker,objQInput; //编辑组件以及记录当前活动的Editor

        var oTBody = null;//内容所在容器对象
        var oDataTable = null;//oTBody容器对象
        var oTBodyTable = null;//内容table对象
        var oTBodyTR = null;//内容tr对象
        var oTBodyTD = null;//内容cell对象
        var oFirstLineDiv = null;//第一行cell中的div对象,用来控制整个内容表的列宽
        var vTableCol,vTableRow;//存储当前操作的cell
        var vPreviousCol,vPreviousRow,vPreviousRowForXML;//存储上次操作的cell位置
        var vSelectionMode = "row";//选中方式（默认为单元格选中）
        var vPKColName = "";//用来唯一标识每一行的XML属性名

        var allowResizeModle = true;//是否可以调整列宽

        var vMouseStart,objSplitBar; //鼠标初始位置,当前活动splitbar

        var bIsSelected = false;//单元格是否被选中
        var objScrollTrack; //记录鼠标跟随选择的TD对象
        var oSortBtn = null;//排序按钮

        var curScrollLeftStatus = 0;//水平滚动条当前的scrollLeft
        var curScrollTopStatus = 0;//垂直滚动条当前的scrollTop

        var oEditor;//当前输入框
        var oCurCell;//当前Cell
        var curContent;//当前cell中的内容

        var curPage = 1;//当前页
        var oPageSize = 20;//每页显示的记录数，默认为20条
        
        var arrCheckedRow = new Array();//用来保存用户通过checkBox选择行的__rowid
        var intRows = 0;
        var oArrayContain = new Array();//缓存cell对象
      
        function putSelectionMode(arg){
          this.vSelectionMode = arg;
        }

        function putPageSize(arg){
            oPageSize = arg;
        }
        
        function putPKColName(argPKColName){
          this.vPKColName = argPKColName;
        }
        
        function getDataXML(){//设置Data的DOMDocument object
            return oDataXML;
        }

        function putDataXML(argXML){
          initGlobalCommon();
          if(inputXML(argXML)){             
            oDataXML = inputXML(argXML);
            if(oDataXML!=null) objDeletedXMLFragement = inputXML();
            getCopyDataXML();
            if(oDataTable){//...
              fillInTable();
              updateData();             
            }           
          }else{ 
            oDataXML = null;
          }          
        }

        function getTableRow(){
          return vTableRow;
        }

        function putTableRow(argRow){
          vTableRow = parseInt(argRow);
        }

        function getTableCol(){
          return vTableCol;
        }

        function putTableCol(argCol){ 
          vTableCol = parseInt(argCol);
        }
        
        function getTitleXML(){//设置标题的DOMDocument object
          return oTitleXML;
        }

        function putTitleXML(argXML){
          //alert("title");
          initGlobalCommon();
          clear();          
          var oTitleFragement = inputXML(argXML);
          if(oTitleFragement) 
            oTitleXML = oTitleFragement;
          else 
            oTitleXML = null;
        }   

        function inputXML(argSource){ //生成XML DOM对象
          
          if(typeof(argSource) == "string"){//处理XML数据岛
            if((!(argSource.search(/\./) != -1 && argSource.search(/\</) == -1)) &&  (!(argSource.search(/\</) != -1))){
              try{                                                                                                                
                      argSource = eval(window.document.all(argSource));
              }catch(e){
              }
            }
          }
                  
          return __objGlobalCommonInst.inputXML(argSource);

        }
        
        
        function createSplitBar(argParent){ //创建用来调整列宽的Span
          objSplitBar = window.document.createElement("<span class='phms_grid_split'></span>");
          objSplitBar.innerText = " ";
          with(objSplitBar){
            onmousedown = splitStart; //起始
            onmouseup = splitEnd; //结束
          }
          argParent.appendChild(objSplitBar);
        }

        function splitStart(){ // 拖动表头开始

          window.event.cancelBubble = true; 
          if (allowResizeModle.toString() ==  "false") return ;
        
          vMouseStart  =  window.event.clientX;
          objSplitBar  =  window.event.srcElement; // 准备活动的 splitbar   
          
          var oSplitLine = window.document.createElement("<span class='phms_grid_splitLine'></span>");//用来调整表头的span
          oSplitLine = objSplitBar.appendChild(oSplitLine);
          oSplitLine.style.pixelHeight = height;

          objSplitBar.setCapture(true); //开始鼠标捕获
          objSplitBar.attachEvent("onmousemove",split); // 绑定 mousemove 事件
        }

        function split(){ //在 split bar' onmousemove 过程中执行
          objSplitBar.children(0).style.left  =  window.event.clientX - vMouseStart + 4; // split line 的移动
        }

        function splitEnd(){// 拖动表头结束

          if (allowResizeModle.toString() ==  "false") return ;
          if(objSplitBar ==  null) return;

          var oCurTitleDiv = objSplitBar.parentElement.parentElement.previousSibling.children(0);// 当前点击的div
          objSplitBar.releaseCapture(); //解除鼠标捕获
          objSplitBar.detachEvent("onmousemove",split); //解除mousemove事件的绑定
          objSplitBar.children(0).removeNode(true); //移除split line
          objSplitBar = null;

          vMoveLen  =  window.event.clientX - vMouseStart; //移动的距离
          vCellIndex = oCurTitleDiv.parentNode.cellIndex; //当前点击 DIV 所在 TD 的索引号

          if(vMoveLen!=0){

            oCurTitleDiv.style.pixelWidth = oCurTitleDiv.offsetWidth + vMoveLen;

            if(oCurTitleDiv.offsetWidth < oCurTitleDiv.MinWidth - 4) //取最小宽度
              oCurTitleDiv.style.pixelWidth  =  oCurTitleDiv.MinWidth - 4;
            if(oCurTitleDiv.offsetWidth > oCurTitleDiv.MaxWidth - 4) //取最大宽度
              oCurTitleDiv.style.pixelWidth = oCurTitleDiv.MaxWidth - 4;
            if(oTBodyTable.rows(0)!=null)
              oTBodyTable.rows(0).cells(vCellIndex).childNodes(0).style.pixelWidth = oCurTitleDiv.style.pixelWidth;
          }
          vMouseStart  =  null;
          oCurTitleDiv  =  null;
          adjustGridWidth(1); //调整title body table三者宽度
          evtOnDrag.fire(); //激发拖动事件
        }

        function adjustBodyWidth(){ //调整三部分宽度，加上偏移量，并产生校调晃动
          if(oTitle==null || oTBody==null) return;
          if(hasTitle.toString() == "true") oTBody.style.pixelWidth = oTBodyTable.offsetWidth + 1;
          else oTBody.style.pixelWidth = width - 16; //如果没有表头就不能根据data table来确定data div的宽度
          oTitle.style.pixelWidth = oTBodyTable.offsetWidth + 1;
        }

        function selectScrollTrack(){ //跟随鼠标滚动选择
          var objSrc = window.event.srcElement;

          for(var i = 0; i < 3; i++){
            if(objSrc.tagName.toLowerCase() == "tr") break;
            objSrc = objSrc.parentElement;
          }