Полагаю, вы хотите добавить ссылку на каждое имя. В этом случае вам понадобится что-то вроде
<xsl:template match="name">
<a>
<xsl:attribute name="href">
<xsl:text>#</xsl:text><xsl:value-of select="."/>
</xsl:attribute>
<xsl:value-of select="."/>
</a>
</xsl:template>
Это создаст такие элементы, как <a href="#horror">horror</a>
EDIT
ОК, вот пример таблицы с элементами div, которые сворачиваются / раскрываются при нажатии кнопки. Хорошая планировка, которую я оставил для вас; это всего лишь пример того, как создать html с использованием xslt, включая javascript с переключателем hide / show.
<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="html" version="1.0" encoding="UTF-8" indent="yes"/>
<xsl:template match="/">
<html>
<head>
<title>trial</title>
<script type="text/javascript" language="javascript">
//expand and collapse functions based on id
function toggleById(IdStart) {
var divs = document.getElementsByTagName('div');
for (var i=0<xsl:text>;</xsl:text> i<divs.length<xsl:text>;</xsl:text> i++) {
if (divs[i].id.match("^"+IdStart) == IdStart) {
if( divs[i].style.display == "none")
{
divs[i].style.display = "block"
}
else {
divs[i].style.display = "none"
}
}
}
return true;
}
</script>
</head>
<body>
<table border="solid black 1pt;" style="border-collapse:collapse;padding:0;border-spacing:0">
<tr>
<th>house name</th>
<th>details</th>
</tr>
<xsl:apply-templates/>
</table>
</body>
</html>
</xsl:template>
<xsl:template match="name">
<tr>
<td>
<input>
<xsl:attribute name="type">button</xsl:attribute>
<xsl:attribute name="onclick">toggleById('<xsl:value-of select="."/>'); return true;</xsl:attribute>
<xsl:attribute name="onMouseOver">this.style.cursor='hand'</xsl:attribute>
<xsl:attribute name="value"><xsl:value-of select="."/></xsl:attribute>
</input>
</td>
<td>
<div>
<xsl:attribute name="id"><xsl:value-of select="."/></xsl:attribute>
<xsl:attribute name="style">display:none</xsl:attribute>
<xsl:copy-of select=".."/>
</div>
</td>
</tr>
</xsl:template>
<xsl:template match="text()"/>
</xsl:stylesheet>
Применительно к
<?xml version="1.0" encoding="UTF-8"?>
<Houses>
<search>
<id>1</id>
<name>horror</name>
<address>09, west Road</address>
<city>London</city>
<pcode>se4 7jk</pcode>
<contact>020574110832</contact>
</search>
<search>
<id>2</id>
<name>nice</name>
<address>05, East Road</address>
<city>London</city>
<pcode>po4 3df</pcode>
<contact>none</contact>
</search>
</Houses>
Это дает
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>trial</title>
<script type="text/javascript" language="javascript">
//expand and collapse functions based on id
function toggleById(IdStart) {
var divs = document.getElementsByTagName('div');
for (var i=0; i<divs.length; i++) {
if (divs[i].id.match("^"+IdStart) == IdStart) {
if( divs[i].style.display == "none")
{
divs[i].style.display = "block"
}
else {
divs[i].style.display = "none"
}
}
}
return true;
}
</script>
</head>
<body>
<table border="solid black 1pt;" style="border-collapse:collapse;padding:0;border-spacing:0">
<tr>
<th>house name</th>
<th>details</th>
</tr>
<tr>
<td><input type="button" onclick="toggleById('horror'); return true;" onMouseOver="this.style.cursor='hand'" value="horror"></td>
<td>
<div id="horror" style="display:none">
<search>
<id>1</id>
<name>horror</name>
<address>09, west Road</address>
<city>London</city>
<pcode>se4 7jk</pcode>
<contact>020574110832</contact>
</search>
</div>
</td>
</tr>
<tr>
<td><input type="button" onclick="toggleById('nice'); return true;" onMouseOver="this.style.cursor='hand'" value="nice"></td>
<td>
<div id="nice" style="display:none">
<search>
<id>2</id>
<name>nice</name>
<address>05, East Road</address>
<city>London</city>
<pcode>po4 3df</pcode>
<contact>none</contact>
</search>
</div>
</td>
</tr>
</table>
</body>
</html>
Попробуйте сделать это в браузере, и вы увидите поведение развертывания / свертывания.