利用xml和xsl自动生成菜单

最新推荐文章于 2015-03-21 07:09:36 发布

smmi

最新推荐文章于 2015-03-21 07:09:36 发布

阅读量161

点赞数

文章标签： XSL XML 中国移动

本文链接：https://blog.csdn.net/smmi/article/details/83798136

版权

autoMakeMenus.xml

<?xml version="1.0" encoding="GB2312"?>
<TestMenus>
	<menuO id="01" name="中国移动总公司" phone=""  address="中国 北京" leader="" type="" create_date="" description="" parentid="">
    <menuOU id="001" name="四川移动分公司" phone=""  address="四川 成都" leader="" type="" create_date="" description="" parentid="">
      <menuOU id="0001" name="成都移动分公司" phone=""  address="" leader="" type="" create_date="" description="" parentid="">
        <menuOU id="00001" name="高新区分公司" phone="110476592"  address="" leader="" type="" create_date="" description="" parentid=""/>
        <menuOU id="00002" name="双流县分公司" phone="110476592"  address="" leader="" type="" create_date="" description="" parentid=""/>
      </menuOU>
		</menuOU>
  </menuO>
</TestMenus>

autoMakeMenus.xsl

<?xml version="1.0" encoding="GB2312" ?>
<xsl:stylesheet xmlns:xsl = "http://www.w3.org/1999/XSL/Transform" version = "1.0"> 
	
<xsl:template match="menuO">
		<img src="book.gif">
		<xsl:attribute name="onclick">OpenOrCloseSubTree(allDivSubTreeObj<xsl:value-of  select="@id"/>)</xsl:attribute>
		</img>
	
		<font color="green">
			<B><xsl:value-of  select="@name"/> </B>
		</font>
		
		<div  style="display:none">
			<xsl:attribute name="id">allDivSubTreeObj<xsl:value-of  select="@id"/></xsl:attribute>
			<xsl:apply-templates select="menuOU">
			  <xsl:with-param name = "A" >1</xsl:with-param> 
			  <xsl:with-param name = "B" ><xsl:value-of  select="@id"/></xsl:with-param> 
			</xsl:apply-templates >
		</div>
		<p/>
</xsl:template>

<xsl:template  match="WstOU"> 
		<xsl:param name = "A" /> 
		<xsl:param name = "B" /> 

	<table border="0" width="176" height="26">
		<tr> 
			<td height="20" width="15" valign ="top">
				<img src="book.gif">
					<xsl:attribute name="onclick">OpenOrCloseSubTree(subTreeDiv<xsl:value-of  select="@id"/>)</xsl:attribute>
				</img>
			</td>
			
			<td height="20" width="145" valign ="top"  >
					<input type="checkbox">
						<xsl:attribute name="value"><xsl:value-of  select="@id"/> 
						</xsl:attribute>
						<xsl:attribute name="id">CHECKOBJ<xsl:value-of select = "$B" /><xsl:value-of select = "$A" />
						</xsl:attribute>
						<xsl:attribute name="onclick">clickNode("<xsl:value-of select = "$B" />","<xsl:value-of select = "$A" />")</xsl:attribute>
					</input>
					
					<input type="hidden">
							<xsl:attribute name="id">CHECKTXT<xsl:value-of select = "$B" /><xsl:value-of select = "$A" /></xsl:attribute>
							<xsl:attribute name="value"><xsl:value-of  select="@name" />
							</xsl:attribute>
					</input>
					
			 		<xsl:value-of  select="@name" /> 
			 		<div style="display">
						<xsl:attribute name="id">subTreeDiv<xsl:value-of  select="@id"/> 
						</xsl:attribute>
			 		
            <xsl:apply-templates select="WstOU">
              <xsl:with-param name = "A" select="$A+1" />
              <xsl:with-param name = "B" select="$B"/>
            </xsl:apply-templates >  
					</div>
			 </td>
		</tr>
	</table>
</xsl:template>

</xsl:stylesheet>

index.htm

<HTML>
<HEAD>
<script>

function init() {
		var xslDoc
		xmlDoc = loadDOM("autoMakeMenus.xml");
		xslDoc = loadDOM("autoMakeMenus.xsl");
		try{
			folderTree.innerHTML = xmlDoc.documentElement.transformNode(xslDoc);
			alert(folderTree.innerHTML);
		}catch (e)
		{
			alert(e.description);
		}
}

function loadDOM(file) {
   var dom;
   try {
     dom = makeDOM(null);
     dom.load(file);
   } catch (e) {
     alert(e.description);
   }
   return dom;
}

function makeDOM(progID) {
  if (progID == null) {
    progID = "msxml2.DOMDocument.4.0";
  }

  var dom;
  try {
    dom = new ActiveXObject(progID);
    dom.async = false;
    dom.validateOnParse = false;
    dom.resolveExternals = false;
  }catch (e) {
    alert(e.description);
  }
  return dom;
}

var strAllOUNames="";

function clickNode(OID,OuID) {
	var i=0;
	var obj;
	var objname;
	var PathCount=OuID;
	strAllOUNames="";
	
	for(i=PathCount+1;i<5000;i++) {
		objname="CHECKOBJ"+OID+i;
		try{
			obj=document.all(objname);
			if(obj==null)
				break;
			obj.checked=false;
		}catch(e){
			break;
		}
	}
	
	for(i=1;i<PathCount;i++) {
		objname="CHECKOBJ"+OID+i;
		obj=document.all(objname);
		obj.checked=true;
		objname="CHECKTXT"+OID+i;
		obj=document.all(objname);
		strAllOUNames+=obj.value;
		strAllOUNames+="/";
	}
	
	objname="CHECKOBJ"+OID+OuID;
	obj=document.all(objname);
	if(obj.checked==true) {
		objname="CHECKTXT"+OID+OuID;
		obj=document.all(objname);
		strAllOUNames+=obj.value;
		strAllOUNames+="/";
	}
}

function OpenOrCloseSubTree(targetelement) {
	if (targetelement.style.display=="none")
	    targetelement.style.display='';
	else
	    targetelement.style.display="none";
}

function OnOKButSet() {
	if(strAllOUNames=="") {
		alert("请选择公司");
		return ;
	}
	alert(strAllOUNames);
	window.returnValue=strAllOUNames;
	close();
}

function OnCloseWindow() {
	close();
}
	
</script>
</HEAD>
<BODY ONLOAD="init()" >
<table border="0" >
	<tr>
		<td >
			<DIV id="folderTree" STYLE="PADDING-TOP: 8px">
				<input type="button" Value="确定" οnclick="OnOKButSet()">
				<input type="button" Value="取消" οnclick="OnCloseWindow()">
			</DIV>
	　	</td>
	</tr>
</table>
</BODY>
</html>