select.htc

HTC,demo WEB用于。 超大型

<public:component name="Select" urn="Select" lightweight=true>
<public:property name="xmlSource" put="putXMLSource"/>
<public:property name="valueCol" put="putValueCol"/>
<public:property name="textCol" put="putTextCol"/>
<public:property name="value" get="getValue" put="putValue"/>
<public:property name="text" get="getText" put="putText"/>
<public:property name="comStyle" value="dropdown"/>
<public:property name="bindChange" put="bindEvtChange"/>
<public:property name="clear" put="clear"/>
<public:property name="top" value="0" put="putTop"/>
<public:property name="left" value="0" put="putLeft"/>
<public:property name="width" value="120" put="putWidth"/>
<public:property name="height" value="20" put="putHeight"/>
<public:property name="autoSize" value="false"/>
<public:property name="caption" put="putCaption"/>
<public:property name="init" put="initialize"/>
<public:property name="refresh" put="refresh"/>
<public:property name="readOnly" put="putReadOnly" get="getReadOnly"/>
<public:property name="visible" put="putVisible" get="getVisible"/>
<public:property name="expand" put="putExpand" get="getExpand"/>
<public:event name="onchange" id="evtChange"/>
<public:attach event="onmousedown" onevent="clickElement()"/>

<script language="JavaScript">

var ouvSPAN = null;//用来获取标题的宽,该对象不显示
var oDiv = null;//input和button的容器
var objInput; // input box
var objLight; // lignt step object
var objBtn; // dropdown button object(image)
var objList; // dropdown list box
var objXMLDoc; //xml's document object
var objSelectedOption; //最后选择的选择项
var vElementTop; //element's absolute top
var vValue = "";
var vText = "";
var vListMaxHigh,vOptionLineHigh;
var vTimeout; // timer
var vCaption;//标题
var bInputChange; //false表示为内部改变,true表示为外部改变
var vClickNum; //记录不离开element范围之内的onmousedown element的次数
var vTop = 0;
var vLeft = 0;
var vWidth = 120;
var vHeight = 20;
var vVScale = 1;
var vIvsB;
var vValueCol ="";
var vTextCol = "";

function putValueCol(argValueCol){
  vValueCol = argValueCol;
}

function putTextCol(argTextCol){
  vTextCol = argTextCol;
}

function putTop(argTop){
  vTop = argTop;
}

function putHeight(argHeight){
  vHeight = argHeight;
  vVScale = 1;
}

function putLeft(argLeft){
  vLeft = argLeft;
}

function putWidth(argWidth){
  vWidth = argWidth;
}

function putXMLSource(argSource){

  var vXSLTOfTransDic = "<?xml version=\"1.0\" encoding=\"UTF-8\"?><xsl:stylesheet version=\"1.0\" xmlns:xsl=\"http://www.w3.org/1999/XSL/Transform\" xmlns:fo=\"http://www.w3.org/1999/XSL/Format\"><xsl:output method=\"html\" indent=\"yes\"/><xsl:template match=\"/\"><table cellspacing=\"0\" cellpadding=\"0\" border=\"0\" class=\"sc_sec_table\"><tbody><xsl:apply-templates select=\"/*/*\"/></tbody></table></xsl:template><xsl:template match=\"/*/*\"><tr style=\"HEIGHT:15;\"><xsl:if test=\"position() mod 2!=0\"><xsl:attribute name=\"bgcolor\">#F3F8FC</xsl:attribute></xsl:if><xsl:if test=\"position() mod 2=0\"><xsl:attribute name=\"bgcolor\">#E9F0F8</xsl:attribute></xsl:if><td style=\"paddingLeft:5;paddingTop:1;\"><xsl:attribute name=\"noWrap\">true</xsl:attribute><xsl:attribute name=\"value\"><xsl:value-of select=\"@" + vValueCol + "\"/></xsl:attribute><xsl:value-of select=\"@" + vTextCol + "\"/></td></tr></xsl:template></xsl:stylesheet>";

	objXMLDoc = inputXML(argSource);
	if(typeof(__objGlobalCommonInst) == "undefined"){
		objList.innerHTML = window.dialogArguments.__objGlobalCommonInst.transformXML(objXMLDoc,vXSLTOfTransDic);
	}else{
		objList.innerHTML = __objGlobalCommonInst.transformXML(objXMLDoc,vXSLTOfTransDic);
	}
}

function getValue(){
	return vValue;
}

function putValue(argValue){
	var objNode,vValueTemp,vTextTemp,objEvent;
	if(!objXMLDoc) return;
	/////////hzh 2004/03/26 add/////
	if(typeof(objXMLDoc) == "string") 
	  objXMLDoc = inputXML(objXMLDoc);
	//////////////add end/////////////////
	objNode = objXMLDoc.selectSingleNode("/*/*[@" + vValueCol + "='" + argValue +"']");
	if(objNode){ //arg exist in xml source
		vValueTemp = argValue;
		vTextTemp = objNode.getAttribute(vTextCol);
	}
	else{ //not in xml source
		if(comStyle == "combo"){
			vValueTemp = argValue;
			vTextTemp = argValue;
		}
		else{
			vValueTemp = "";
			vTextTemp = "";
		}
	}
	if(vValue != vValueTemp || vText != vTextTemp){ //fire element's onchange event
		vValue = vValueTemp;
		vText = vTextTemp;
		bInputChange = false; //not fire objInput's onpropertychange event,看changeInput()
		if(!objInput) return; //如果没有objInput说明这时是初始状态还没有执行init
		if(objInput.value != vTextTemp) objInput.value = vTextTemp;
		objEvent = createEventObject();
		evtChange.fire(objEvent); //触发onchange事件
	}
}

function putCaption(arg){
  this.vCaption = arg;
}

function getText(){
	return vText;
}

function putText(argText){
	
	var objNode,vValueTemp,vTextTemp,objEvent;
	
	if(!objXMLDoc) return;
	if(typeof(objXMLDoc) == "string") 
	  objXMLDoc = inputXML(objXMLDoc);
	  
	objNode = objXMLDoc.selectSingleNode("/*/*[@" + vTextCol + "='" + argText +"']");
	
	if(objNode){//node in xmlSource
		vTextTemp = argText;
		vValueTemp = objNode.getAttribute(vValueCol);
	}else{//node not in xmlSource
		if(comStyle == "combo"){
			vValueTemp = argText;
			vTextTemp = argText;
		}
		else{
			vValueTemp = "";
			vTextTemp = "";
		}
	}
	
	if(vValue != vValueTemp || vText != vTextTemp){ //fire element's onchange event
		vValue = vValueTemp;
		vText = vTextTemp;
		bInputChange = false; //not fire objInput's onpropertychange event,看changeInput()
		if(!objInput) return; //如果没有objInput说明这时是初始状态还没有执行init
		if(objInput.value != vTextTemp) objInput.value = vTextTemp;
		objEvent = createEventObject();
		evtChange.fire(objEvent); //触发onchange事件
	}
}

function getReadOnly(){
	if(objInput && objInput.style.disable == "") return true;
	else return false;
}

function setBtn(arg){//设置按钮
  var objBtnStyle1 = objBtn.children(0);
  var objBtnStyle2 = objBtn.children(1);
  //

  if(arg.toString() == "false"){
    objBtnStyle1.strokecolor = "#ADC3F7";
    objBtnStyle1.fillcolor = "#B5CFFF";
    objBtnStyle1.fill.color2 ="#DEE3FF";
    objBtnStyle2.strokecolor = "#4A6184";
  }else{
    objBtnStyle1.strokecolor = "#999999";
    objBtnStyle1.fillcolor = "#F0F0F0";
    objBtnStyle1.fill.color2 ="#cccccc";
    objBtnStyle2.strokecolor = "#AAAAAA";
  }
    
}

function putReadOnly(argBool){
  //
	if(argBool.toString() == "true"){ //只读
		with(objBtn){
			onmousedown = noResponse;
			onmouseover = noResponse;
			onmouseup = noResponse;
			onmouseout = noResponse;
		}
		setBtn(argBool);
		
		with(oDiv){//边框的颜色
		  //style.border = "#cccccc";
		  //
		  style.borderColor = "#cccccc";
		}
		with(objInput){
			disabled = true;
			onmouseover = noResponse;
			onmouseout = noResponse;
			onmouseup = noResponse;
			onkeydown = noResponse;
			if(comStyle =="combo"){
				onmousedown = noResponse;
				onpropertychange = noResponse;
			}
			else{
				onmousedown = noResponse;
			}
		}		 
		
		////////////////////////////////////////////////

		/////////////////////////////////
	}
	else{ //解除只读
		with(objBtn){
			onmousedown = clickBtn; //打开List
			onmouseover = overBtn; //objBtn变亮
			onmouseup = overBtn; //弹起时恢复原over样式
			onmouseout = outBtn; //objBtn恢复初始状态
		}
		
		with(oDiv){//边框的颜色
		  style.borderColor = "#7B9EBD";
		}
		
		setBtn(argBool);
		with(objInput){
			disabled = false;
			onmouseover = overBtn; //打开list
			onmouseout = outBtn; //objBtn恢复初始状态
			onmouseup = overBtn; //变为over状态
			onkeydown = turn; //依次翻动选项
			if(comStyle =="combo"){
				onmousedown = hideList3;
				onpropertychange = changeInput;
			}
			else{
				onmousedown = clickBtn;
			}
		}
	}
	if(comStyle != "combo"){
		with(objInput){
			readOnly = true;
			style.cursor = "hand";
		}
	}
}

function getVisible(){
	if(element.style.display == "none") return false;
	else return true;
}

function putVisible(argBool){
	if(argBool.toString() == "true"){
		with(element){
			style.visibility = "hidden"; //这里这样变换是因为在"displya='none'"状态下无法将element定位于给定的定位值
			style.display = "block"; //true表示可视
			refresh();
			style.visibility = "visible";
		}
	}
	else{ //false 表示不可视
		if(objList) hideList(); //隐藏date list
		element.style.display = "none";
	}
}

function getExpand(){
	if(!objList) return false;
	else return true;
}

function putExpand(argBool){ //是否张开
	if(argBool.toString() == "true"){ //true
		//if(!objList){ //如果不存在则建立 date list
			overBtn();
			showList();
			clickElement();
		//}
	}
	else{ //false
		if(objList) hideList2(); //如果objList已存在且已打开
	}
}

function bindEvtChange(argHandle){
	element.onchange = argHandle;
}

function changeInput(){ //objInput's onpropertychange
	if(window.event.propertyName.toLowerCase() == "value" && bInputChange){
		value = objInput.value;
	}
	bInputChange = true;
}

function clickDocument(){ 
//单击Document关闭list,在某一次单击element时绑定到window.document对象上
	var objSrc;

	if(!objList) return;
	objSrc = window.event.srcElement;
	if(element.contains(objSrc)) return;
	hideList2(); 
	//下拉框消失,objBtn变成初始状态
	window.document.detachEvent("onmousedown",clickDocument);
	vClickNum = false;
}

function clickElement(){ 

//单击element绑定clickdocument,对于一次"绑定-解除绑定"过程来说仅绑定一次而不会每次单击element就绑定
	if(!vClickNum){
		window.document.attachEvent("onmousedown",clickDocument);