Monday, March 21, 2016

How to use XSLT for SharePoint listview



1) Create list with column "First Name" and "Last Name"
2) Create XSLT file with below XSLT tags and upload this to pages library.


<xsl:stylesheet version="1.0"

              xmlns:xsl="http://www.w3.org/1999/XSL/Transform"

              xmlns:msxsl="urn:schemas-microsoft-com:xslt"

              exclude-result-prefixes="msxsl" xmlns:ddwrt2="urn:frontpage:internal">



  <xsl:output method='html' indent='yes'/>



  <xsl:template match='dsQueryResponse'>
<style>

.LD{
    border-collapse: collapse;
    width: 100%;
}
.LD table, .LD td, .LD th {    
    border: 1px solid #ddd;
    text-align: left;
    width: 25%;

}


.LS th, .LS td {
    padding: 10px;
}

.LS{
    border-collapse: collapse;
    width: 100%;
}
.LS table, .LS td, .LS th {    
    border: 1px solid #ddd;
    text-align: left;
    width: 25%;

}


.LS th, .LS td {
    padding: 15px;
}

</style>

    <table class="LD"  >    

     <xsl:apply-templates select='Rows/Row'/>

    </table>

  </xsl:template>



  <xsl:template match='Row'>


<tr style="background-color:#e9e9e9;">

        <td style="border-width: 0px;">

            <b style="font-size:25px;padding-right:10px"><xsl:value-of select="@First_x0020_Name"></xsl:value-of> </b>
             <b style="font-size:25px"><xsl:value-of select="@Last_x0020_Name"></xsl:value-of> </b>

        </td>
 
 </tr >



 
  </xsl:template>

</xsl:stylesheet>
3) Insert a List view webpart for people list, change the properties of XSLT url with the correct url.

4) Save and check the page.

HTML

Script:

JS