Does anybody have any suggestions?ThanksJoe​<apex:page standardController="Account" showHeader="true"
tabStyle="account" >
<style>
.activeTab {background-color: ⌗F9AF31; color:black;
background-image:none}
.inactiveTab { background-color: ⌗9FD8F6; color:black;
background-image:none}
.AcctListStyle {font-size: 10pt; font-color: ⌗333333; background-image:none}
</style>
<apex:tabPanel switchType="client" selectedTab="tabdetails"
id="AccountTabPanel" tabClass="activeTab"
inactiveTabClass="inactiveTab">
<apex:tab label="Details" name="AccDetails" id="tabdetails" styleclass="AcctListStyle">
<apex:detail relatedList="false" title="true"/>
</apex:tab>
<apex:tab label="Contacts" name="Contacts" id="tabContact" styleclass="AcctListStyle">
<apex:relatedList subject="{!account}" list="contacts" />
</apex:tab>
<apex:tab label="Opportunities" name="Opportunities" id="tabOpp" styleclass="AcctListStyle">
<apex:relatedList subject="{!account}" list="opportunities" />
</apex:tab>
<apex:tab label="Activities" name="OpenActivities" id="tabOpenAct" styleclass="AcctListStyle">
<apex:relatedList subject="{!account}" list="OpenActivities" />
<apex:relatedList subject="{!account}" list="ActivityHistories" />
</apex:tab>
<apex:tab label="Notes and Attachments" name="NotesAndAttachments" id="tabNoteAtt" styleclass="AcctListStyle">
<apex:relatedList subject="{!account}" list="CombinedAttachments" />
</apex:tab>
<apex:tab label="Docusigns" name="Docusigns" id="Docusigns" styleclass="AcctListStyle">
<apex:relatedList subject="{!account}" list="dsfs__R00N80000002eb1GEAQ__r" />
</apex:tab>
<apex:tab label="Other Applications" name="Otherapplications" id="otherApps" styleclass="AcctListStyle">
<apex:relatedList subject="{!account}" list="Courses__r" title="Bespoke/In-house Courses"/>
</apex:tab>
</apex:tabPanel>
<script>
$(document).ready(function(){
document.getElementById("j_id0:tabContact_lbl").onclick = function(){
var date = document.getElementsByClassName("DateElement").value;
var varDate = new Date(date);
var today = new Date();
var 1year = 3153600000;
today.setHours(0,0,0,0);
if(varDate <= today - 1year) {
date.style.color = "red";
};
});
});
</script>
</apex:page>
Hi Joe,I am not sure of which text you want to change the colour to Red but yes you can achieve it.Below is the code snippet you can use to change background color of the recordBut before that I would like to comment few things.1. document.getElementsByClassName always return an array. so you should you the use index to get the exact element you want to use. hence code will be
var date = document.getElementsByClassName("DateElement")[1].value; // index is 1 here because 0th will be index of the column name having class DateElement and 1 will be index of column having the actual value of Date
2. There is a bug on line 48 line it should be like
}; // not });
4. You need to include jquery if using $(document).ready(function() .... .. .. ..)};
3. To change the style property you need to access element/object not its value ex:
P.S. In case if there will be more than one related list having the date field or you can say that in case if there will be more element having the same "DateElement" Class then it might break the functionality.I would request you to go through javascript to learn it better.Please mark it as best answer if it helps you understanding the concept. Regards,Ashish Kr.document.getElementById("j_id0:tabContact_lbl").onclick = function(){
var date = document.getElementsByClassName("DateElement")[1].value;
var dataCells = document.getElementsByClassName("dataCell");
dataCells[0].style.background = "Red"; // this will change the background color of 1st contact..
//Please follow the approach as per your requirement.
var varDate = new Date(date);
var today = new Date();
var year = 3153600000;
today.setHours(0,0,0,0);
if(varDate <= (today - year)) {
console.log(true);
// date.style.color = "red"; date contains the value so can't access style attribute/property
};
};