Apex Code Development You need to sign in to do that
Don't have an account?
bujji Regarding Pageblock table Row background color
Hi,
My Issue is like this i am displaying accounts and when ever i click on that account that entire ROW background color has to be set green. It is working fine but when i click on the 2nd Row the 1st Row background color should vanish.
But it displaying background color to all rows which ever i selected.Please fix it.
I am pasting the code here.
<apex:page standardController="Account" recordSetVar="act" sidebar="true" showHeader="false" wizard="false" tabStyle="Inv1__tab">
<apex:form id="accForm">
<apex:pageBlock title="All Acounts" >
<apex:pageMessage summary="Click on the account name" severity="info" strength="2"/>
<apex:pageBlockTable id="accTable" value="{!act}" var="a" onrowClick="show(this);">
<apex:column headerValue="Account Name"><a href="#">{!a.Name}</a></apex:column>
<apex:column headerValue="Phone" >{!a.phone}</apex:column>
<apex:column headerValue="Billing State/Province" >{!a.BillingState}</apex:column>
<apex:column headerValue="Website" >{!a.Website}</apex:column>
</apex:pageBlockTable>
</apex:pageBlock>
</apex:form>
<style>
.selectedDataRow {
background-color: #ccffbb;
}
</style>
<script>
function show(rowVar){
rowVar.className="selectedDataRow";
}
</script>
</apex:page>
Thanks,
Bujji
Hi,
Try the below code snippet as reference:
<apex:page standardController="Account" recordSetVar="act" sidebar="true" showHeader="false" wizard="false" >
<apex:form id="accForm">
<apex:pageBlock title="All Acounts" >
<apex:pageMessage summary="Click on the account name" severity="info" strength="2"/>
<apex:pageBlockTable id="accTable" value="{!act}" var="a" onrowClick="show(this);">
<apex:column headerValue="Account Name"><a href="#">{!a.Name}</a></apex:column>
<apex:column headerValue="Phone" >{!a.phone}</apex:column>
<apex:column headerValue="Billing State/Province" >{!a.BillingState}</apex:column>
<apex:column headerValue="Website" >{!a.Website}</apex:column>
</apex:pageBlockTable>
</apex:pageBlock>
</apex:form>
<style>
.selectedDataRow {
background-color: #ccffbb;
}
</style>
<script>
var previousrrow='';
function show(rowVar)
{
var classname1=rowVar.className;
rowVar.className="selectedDataRow";
if(previousrrow=='')
{
previousrrow=rowVar;
}
else
{
if(previousrrow.innerHTML!=rowVar.innerHTML)
{
previousrrow.className=classname1;
previousrrow=rowVar;
}
}
}
</script>
</apex:page>
Did this answer your question? If not, let me know what didn't work, or if so, please mark it solved.
you are awesome man, exactly that is want i want.
Small thing when we click on the account name can the same account name will display on the
<apex:pageMessage> block.It has to change dynamically according to the account name we click.
Thanks,
Baujji
He can you please help me with the javascript to change the row colours on click , and change the prior selected row color to white.
i am having hardtime working n this .
Thanks,
in advance
thanks a lot
Hi when i open my vfpage in apex:tab row background colour not working. so what is the problem can any body suggest the solution.
Go through the example below
<apex:page standardController="Account" recordSetVar="accounts" sidebar="false">
<style>
.rowColor {
background-color:orange;
}
</style>
<script>
var pRow='';
function highlightElem(a) {
var c=a.className;
// alert(c);
a.className="rowColor";
if(pRow==''){
pRow=a;
}
else {
if(pRow.innerHTML!=a.innerHTML) {
pRow.className=c;
pRow=a;
}
}
}
</script>
<apex:form >
<apex:pageBlock >
<apex:PageBlockTable value="{!accounts}" var="r" onRowClick="highlightElem(this)" >
<apex:column value="{!r.Name}" />
<apex:column value="{!r.Phone}" />
<apex:column value="{!r.Type}" />
</apex:PageBlockTable>
</apex:pageBlock>
</apex:form>
</apex:page>
if this provides you with useful information and if this is what you where looking for then please mark it as a solution for other benefits.