Hi I recently came across a jQuery animated table sorter plugin from here and I'm trying to leverage it on one of my visualforce pages. It seems straightforward enough but I can't for some reason get it to work on my page. Below is my code:
<apex:page Controller="CasesController" showHeader="false" docType="HTML-5.0" id="thePage">
<apex:includeScript value="{!URLFOR($Resource.jQuery, 'js/jquery-1.7.2.min.js')}"/>
<apex:includeScript value="{!URLFOR($Resource.jQuery, 'js/jquery.tools-1.2.2.min.js')}"/>
<apex:includeScript value="{!URLFOR($Resource.jQueryAnimatedTableSorter, 'animatedtablesorter-0.2.2/tsort.js')}"/>
<apex:includeScript value="{!URLFOR($Resource.jQueryAnimatedTableSorter, 'animatedtablesorter-0.2.2/tsort.min.js')}"/>
<apex:stylesheet value="{!URLFOR($Resource.jQueryAnimatedTableSorter,'/animatedtablesorter-0.2.2/style.css')}"/>
<apex:form id="theForm">
<apex:pageBlock id="thePageBlock">
<apex:pageBlockTable value="{!MyCaseList}" var="mylist" id="thePageBlockTable">
<apex:column headerValue="Case Number">
<apex:outputLink value="{!mylist.CaseNumber}">{!mylist.CaseNumber}</apex:outputLink>
</apex:column>
<apex:column value="{!mylist.CreatedDate}"/>
<apex:column value="{!mylist.Requested_By__c}"/>
<apex:column value="{!mylist.Subject}"/>
<apex:column value="{!mylist.Release_Type__c}"/>
<apex:column value="{!mylist.Status}"/>
<apex:column value="{!mylist.Priority}"/>
<apex:column value="{!mylist.Version__c}"/>
<apex:column value="{!mylist.OwnerId}"/>
<apex:column value="{!mylist.Type}"/>
</apex:pageBlockTable>
</apex:pageBlock>
</apex:form>
<script language="javascript" type="text/javascript">
var j$ = jQuery.noConflict();
j$(document).ready(function(){
var dataTable = document.getElementById("{!$Component.AssignmentRequest:thePage:theForm:thePageBlock:thePageBlockTable}");
j$(datatTable.tableSorter).tableSort( {
sortBy: ['numeric','numeric','text','text','text','text','text','text','text','text',],
animation: 'slide',
speed: 400
});
});
</script>
</apex:page>
Anyone with any suggestions as to what I may be missing? Thanks.
.
as a separator for the Component:{!$Component.thePage.theForm.thePageBlock.thePageBlockTable}
– Sergej Utko Jun 10 '14 at 15:02