从xml的image标签获取值到xslt

时间:2017-08-09 05:34:42

标签: xml xslt

这是我的xml代码。我想将Image元素值与Xslt一起使用,以便我可以使用xml文档中的图像。请帮助我如何获取图像。我获得了xml的所有其他元素 xslt.My唯一的问题是图像传输。

<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" href="work.xsl"?>
<student>
<studentlist>
    <S.No>1</S.No>
    <Name>Student1</Name>
    <E-mail>ab@xy.in</E-mail>
    <Qualification>MCA</Qualification>
    <createdon>6 Jan 2012</createdon>
    <Image><img src="/home/walkingtree/Desktop/hemanth practice/new/close-icon-41.jpg"/>
    <img src="/home/walkingtree/Desktop/hemanth practice/new/edit.jpg"/>
    </Image>
</studentlist>
<studentlist>
    <S.No>2</S.No>
    <Name>Student2</Name>
    <E-mail>cd@xy.in</E-mail>
    <Qualification>BE</Qualification>
    <createdon>7 Jan 2012</createdon>
    <Image><img src="/home/walkingtree/Desktop/hemanth practice/new/close-icon-41.jpg"/>
    <img src="/home/walkingtree/Desktop/hemanth practice/new/edit.jpg"/>
    </Image>
</studentlist>
<studentlist>
    <S.No>3</S.No>
    <Name>Student3</Name>
    <E-mail>ef@xy.in</E-mail>
    <Qualification>B.TECH</Qualification>
    <createdon>3 Jan 2012</createdon>
    <Image><img src="/home/walkingtree/Desktop/hemanth practice/new/close-icon-41.jpg"/>
    <img src="/home/walkingtree/Desktop/hemanth practice/new/edit.jpg"/>
    </Image>
</studentlist>
<studentlist>
    <S.No>4</S.No>
    <Name>Student4</Name>
    <E-mail>gh@xy.in</E-mail>
    <Qualification>MCA</Qualification>
    <createdon>23 Dec 2011</createdon>
    <Image><img src="/home/walkingtree/Desktop/hemanth practice/new/close-icon-41.jpg"/>
    <img src="/home/walkingtree/Desktop/hemanth practice/new/edit.jpg"/>
    </Image>
</studentlist>
</student>

这是我的xslt code.its有点冗长,但希望你会得到它。我不知道是否在for-each循环我使用正确的格式..plz帮助我这个

<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
<html>
<head>
<title>Login form</title>
<style>
input{
font: 1em sans-serif;
width: 300px;
box-sizing: border-box;
border: 1px solid #999;
}
.styled-select select {

}
#sel {
font: 1em sans-serif;
width: 230px;
height:31px;
box-sizing: border-box;
border: 2px solid #43C6DB;
height:31px;
background: #fafafa url("/home/walkingtree/Desktop/hemanth        practice/editalll/hello.jpg") no-repeat 100% 50%;
appearance:none;
 -webkit-appearance:none;
}
#form-setting{
display:none;
position:fixed;
left:620px;
top:5px;
width: 390px;
padding: 1em;
border: 1px solid #CCC;
border-radius: 15px 1px;
background-color:#BDEDFF;
}

form div + div {
margin-top: 1em;
}

label {
display: inline-block;
width: 110px;
text-align: left;
}

input{
 font: 1em sans-serif;
 width: 230px;
height:31px;
box-sizing: border-box;
border: 2px solid #43C6DB;
}
.button {
background-color: #89C35C;
border: none;
color: white;
padding: 10px 25px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
cursor: pointer;
border-radius:6px;
}
option{
height:20px;
}

.button2 {border-radius:6px;
background-color: #E55451;
float:right}

#close{position:fixed;
top:0px;
left:1040px;
cursor:pointer;
}
</style>
</head>
<body>
<div>
    <table border="0" cellspacing="0" width="600px">
        <tr>
            <th>
                <div style="background-color:#EF8224">
                    <table width="100%">
                        <tr>
                            <th style="float:left"><font color="white">StudentList</font></th>
                            <th style="float:right"><a href="#" onclick="poped()">Add</a></th>
                            <th style="float:right"><img src="/home/walkingtree/Desktop/adding.png" width="17px" align="right"/></th>
                        </tr>
                    </table>
                </div>
            </th>
        </tr>
        <tr>
            <td>
                <table width="100%">
                    <tr bgcolor="#EF8224">
                        <th style="text-align:left" width="100px">S.No.      </th>
                        <th style="text-align:left">Name</th>
                        <th style="text-align:left">Email</th>
                        <th style="text-align:left">Qualification</th>
                        <th style="text-align:left">CreatedOn</th>
                        <th style="text-align:left">Action</th>
                    </tr>
                    <xsl:for-each select="student/studentlist">
                    <tr style="background-color:#FFDFD6">
                        <td><xsl:value-of select="S.No"/></td>
                        <td><xsl:value-of select="Name"/></td>
                        <td><xsl:value-of select="E-mail"/></td>
                        <td><xsl:value-of select="Qualification"/></td>
                        <td><xsl:value-of select="createdon"/></td>
                        <td><img width="25x" height="25px" src="{/student/studentlist/Image/node()}" class="CalloutRightPhoto"/></td>
                    </tr>
                    </xsl:for-each>
                </table>
            </td>
        </tr>
    </table>
 </div>
 <div id="form-setting">    
    <p>
        <img id="close" src="/home/walkingtree/Desktop/hemanth practice/editalll/close-icon-41.jpg" width="10px" height="10px" onclick="closeform()"/>
    </p>
    <form>
        <table>
            <tr>
                <td>
                     <div>
                            <label for="name">Name<font color="red">* </font>:</label>
                            <input type="text" id="name" name="user_name"/>
                     </div>
                     <div>
                            <label for="mail">E-mail<font color="red">*</font>:</label>
                            <input type="email" id="mail" name="user_mail"/>
                     </div>
                    <div>
                        <label for="qual">Qualification:</label>
                        <select id="sel">
                            <option value=""></option>
                                <option value="MCA">MCA</option>
                                <option value="B.Tech">B.Tech</option>
                        </select>
                        </div>
                </td>
            </tr>

                <tr style="width:100%">
                    <td align="right" style="float:right">
                        <button class="button">submit</button>
                        <button class="button button2">reset</button> 
                    </td>
                </tr>

        </table>
    </form>
 </div>
<script type="text/javascript">
var v=document.getElementById("form-setting");
function poped(){
v.style.display="block";
}
function closeform(){
v.style.display="none"
}
</script>
</body>
</html>
</xsl:template>
</xsl:stylesheet>

这是我从这段代码得到的输出。你可以看到动作不显示任何图片  this is the output i got

这是我需要得到的输出。     see the action column of actual table

1 个答案:

答案 0 :(得分:0)

问题在于这一行:

<img width="25x" height="25px" src="{/student/studentlist/Image/node()}" class="CalloutRightPhoto"/>

首先,通过使用/启动表达式,您已将其设置为基于顶级文档节点的绝对路径,因此不会选择相对于当前学生的图像。

其次,您有多个图片,因此您确实需要xsl:for-each(或xsl:apply-templates此处。

第三,您需要引用src属性来获取所需的图像路径。

尝试将其替换为....

<xsl:for-each select="Image/img">
    <img width="25px" height="25px" src="{@src}" class="CalloutRightPhoto"/>
</xsl:for-each>

请注意在为src元素创建img属性时使用Attribute Value Template。花括号表示要计算的表达式,因此执行{@src}表示获取当前src元素中img属性的值。

如果您想对图像添加onclick操作,则可以,但您需要一种方法来区分图像。也许是这样的......

<xsl:for-each select="Image/img">
    <img width="25px" height="25px" src="{@src}" class="CalloutRightPhoto">
        <xsl:attribute name="onclick">
            <xsl:choose>
                <xsl:when test="contains(@src, 'close-icon-41.jpg')">
                    <xsl:text>doClose();</xsl:text>
                </xsl:when>
                <xsl:otherwise>
                    <xsl:text>doEdit();</xsl:text>
                </xsl:otherwise>
            </xsl:choose>
        </xsl:attribute>
    </img>
</xsl:for-each>