stepunite.htc

HTC,demo WEB用于。 超大型

<!--///////////////////////////////////////////////////////////////////////
    //  Module Name: stepUnite     ///////////////////////////////////////////////////
    //       Author: hzh	        ///////////////////////////////////////////////////
    //		   Date: 2005-01-21   ///////////////////////////////////////////////////
    ///////////////////////////////////////////////////////////////////////-->
<public:component name="stepUnite" urn="stepUnite" lightweight="true">
<public:property name="xmlSource" get="getDataXML" put="putDataXML" />//stepUnite数据源
<!-- stepUnite整体位置、样式    -->
<public:property name="left" put="putLeft" />
<public:property name="top" put="putTop" />
<public:property name="width" put="putWidth" />
<public:property name="secondWidth" put="putSecondWidth" />
<public:property name="caption" put="putCaption" />
<public:property name="text" get="getText" />
<public:property name="value" get="getValue" />
<public:property name="valueCol" put="putValueCol" />
<public:property name="textCol" put="putTextCol" />
<public:property name="init" put="initialize"/>//组件初始化

<script language="JavaScript">

var objXMLDoc = null;
var objFirstSec = null;
var objSecondSec = null;

var vLeft = 0;
var vTop = 0;
var vWidth = 150;
var vSecondWidht = 150;
var vCaption = "";//标题
var vCaptionWidth = 0;

var vText = "";
var vValue = "";
var vValueCol = "";
var vTextCol = "";

function initialize(){// 组件初始化
	
	if(!objXMLDoc) return;
	
	var objOption;
	var objItemList;
	var objCaptionSpan
	
	objCaptionSpan = element.document.createElement("<span style='position:absolute;border:solid 0px green;zIndex:0;font-size:9pt;'>");
	objCaptionSpan = element.appendChild(objCaptionSpan);
	with(objCaptionSpan){
		style.width = vCaptionWidth;
		style.left = 0;
		innerText = vCaption + "  ";
		style.textAlign = "right";
		style.top = 3;
		style.height = 18;
	}	
	
	objFirstSec = element.document.createElement("<select class='phms_stepUnite_firstSelect'>");
	objItemList = objXMLDoc.selectNodes("//root/item");
	if(objItemList.length){
		for(var i = 0; i < objItemList.length; i++){
			objOption = element.document.createElement("<option>");
			objOption.id = objItemList[i].getAttribute("id");
			objOption.value = objItemList[i].getAttribute(vValueCol);
			objOption.text = objItemList[i].getAttribute(vTextCol);
			objFirstSec.add(objOption);
		}
	}
	objFirstSec = element.appendChild(objFirstSec);
	objFirstSec.onchange = getSecondItem;

	with(objFirstSec.style){
		left = vCaptionWidth;
		top = 0;
		width = vWidth;
	}
	
	objSecondSec = element.document.createElement("<select class='phms_stepUnite_secondSelect'>");
	objItemList = objXMLDoc.selectNodes("//root/item[position()=1]/item");
	for(var i = 0; i < objItemList.length; i++){
		objOption = element.document.createElement("<option>");
		objOption.id = objItemList[i].getAttribute("id");
		objOption.value = objItemList[i].getAttribute(vValueCol);
		objOption.text = objItemList[i].getAttribute(vTextCol);
		objSecondSec.add(objOption);
		if(i == 0){
			vText = objItemList[i].getAttribute(vTextCol);
			vValue = objItemList[i].getAttribute(vValueCol);
		}
	}
	objSecondSec = element.appendChild(objSecondSec);
	objSecondSec.onchange = setValue;
	
	with(objSecondSec.style){
		left = parseInt(objFirstSec.style.pixelLeft) + parseInt(objFirstSec.style.pixelWidth);
		top = 0;
		width = vSecondWidht;
	}
	
	with(element.style){
		left = vLeft;
		top = vTop;
		width = objCaptionSpan.offsetWidth + objFirstSec.offsetWidth + objSecondSec.offsetWidth + 2;
	}
}

function setValue(){
	if(objSecondSec.selectedIndex != -1){
		vText = objSecondSec.childNodes[objSecondSec.selectedIndex].text;
		vValue = objSecondSec.childNodes[objSecondSec.selectedIndex].value;
	}
}

function getSecondItem(){
	var vID = event.srcElement.children[event.srcElement.selectedIndex].id;
	var objItem = objXMLDoc.selectSingleNode("//item[@id='" + vID + "']");
	objSecondSec.innerHTML = "";
	
	if(!objItem || objItem.childNodes.length == 0){
		vText = "";
		vValue = "";
	}else{
		for(var i = 0; i < objItem.childNodes.length; i++){
			objOption = element.document.createElement("<option>");
			objOption.id = objItem.childNodes[i].getAttribute("id");
			objOption.value = objItem.childNodes[i].getAttribute(vValueCol);
			objOption.text = objItem.childNodes[i].getAttribute(vTextCol);
			objSecondSec.add(objOption);
			if( i == 0 ){
				vText = objItem.childNodes[i].getAttribute(vTextCol);
				vValue = objItem.childNodes[i].getAttribute(vValueCol);
			}
		}
	}
}


function putDataXML(argXMLSource){
	var vXSLT = "<?xml version='1.0' encoding='UTF-8'?><xsl:stylesheet version='1.0' xmlns:xsl='http://www.w3.org/1999/XSL/Transform'><xsl:output method='xml' version='1.0' encoding='UTF-8' indent='yes'/><xsl:template match='/'><xsl:element name='root'><xsl:apply-templates select='root'/></xsl:element></xsl:template><xsl:template match='root'><xsl:for-each select='*'><xsl:call-template name='itemNode'/></xsl:for-each></xsl:template><xsl:template name='itemNode' match='//item'><xsl:element name='item'><xsl:for-each select='@*'><xsl:copy-of select='.'/></xsl:for-each><xsl:attribute name='id'><xsl:value-of select='generate-id()'/></xsl:attribute><xsl:for-each select='*'><xsl:call-template name='itemNode'/></xsl:for-each></xsl:element></xsl:template></xsl:stylesheet>";
	objXMLDoc = __objGlobalCommonInst.transformXMLToNode(argXMLSource,vXSLT);
	if(!objXMLDoc) return;

}

function putLeft(argLeft){// stepUnite Left
		vLeft = argLeft;
}
function putTop(argTop){// stepUnite Top
	vTop = argTop;
}
function putWidth(argWidth){// stepUnite Width
	vWidth = argWidth;
}

function putSecondWidth(argSecondWidth){// stepUnite Second select Width
	vSecondWidht = argSecondWidth;
}

function putCaption(argCaption){// caption
	vCaption = argCaption;
	vCaptionWidth = parseInt((vCaption + "  ").length) * 12;
}

function putValueCol(argValCol){
	vValueCol = argValCol;
}

function putTextCol(argTextCol){
	vTextCol = argTextCol;
}

function getValue(){
	return vValue;
}

function getText(){
	return vText;
}
</script>
</public:component>