• Jammu Vamsi
  • NEWBIE
  • 0 Points
  • Member since 2021

  • Chatter
    Feed
  • 0
    Best Answers
  • 0
    Likes Received
  • 0
    Likes Given
  • 0
    Questions
  • 1
    Replies
Below is my simple VF page and I have used tablesorter plug in, (http://tablesorter.com/docs/)
It's working fine but I am not able to get/see Sorting arrows.
<apex:page standardController="Property__c" showHeader="false" applyHtmlTag="false" applyBodyTag="false" docType="html-5.0" lightningStylesheets="true">
    <apex:includeScript value="{!$Resource.latest}"/>
    <apex:includeScript value="{!$Resource.tablesorter}"/>
    <apex:includeScript value="{!$Resource.metadata}"/>
    <apex:includeScript value="{!$Resource.tablesortermin}"/>
    <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/ui-lightness/jquery-ui.css" type="text/css" media="all" />
    <script type="text/javascript">
    $j = jQuery.noConflict();    
    $j(document).ready(function () {
    $j("[id$=theaddrs]").tablesorter();
    });    
    </script>
    <script>
    $j(document).ready(function() 
                      { 
                          $("#myTable").tablesorter( {sortList: [[0,0], [1,0]]} ); 
                      } 
                     ); 
    </script>
    <script type="text/javascript" src="/path/to/jquery-latest.js"></script> 
    <script type="text/javascript" src="/path/to/jquery.tablesorter.js"></script> 
    <apex:form >
    <apex:includeScript value="{!$Resource.svg4everybody}"/>
    <html xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" lang="en">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"/>
        <head>
            <meta charset="utf-8" />
            <meta http-equiv="x-ua-compatible" content="ie=edge" />
            <meta name="viewport" content="width=device-width, initial-scale=1" />
            <apex:slds />
        </head>
        <body>
            <div class="slds-scope">
                <div class="myapp">
                    <div class="slds-grid slds-m-top_large">
                        <div class="slds-col slds-col_rule-right slds-p-right_large slds-size_12-of-12">
                            <apex:pageblock mode="details" id="theaddrsblock" >
                                    <apex:pageBlockTable value="{!Property__c}" var="index" styleclass="fixme" id="theaddrs" styleClass="tablesorter" headerClass="header">
                                        <apex:column value="{!index.Name}" >
                                        </apex:column>          
                                        <apex:column value="{!index.Phone__c}">
                                        </apex:column>
                                        <apex:column value="{!index.LandMark__c}">
                                        </apex:column> 
                                        <apex:column value="{!index.Block__c}">
                                        </apex:column> 
                                        <apex:column value="{!index.Rent__c}">
                                        </apex:column>
                                    </apex:pageBlockTable>
                                </apex:pageblock>                                  
                        </div>
                    </div>
                </div>
            </div> 
        </body>
    </html>
        </apex:form> 
</apex:page>

 
  • August 28, 2018
  • Like
  • 0