You need to sign in to do that
Don't have an account?

adding CSS styles to apex:inputcheckbox
I am trying to achieve a simple thing but somehow not able to get the desired result, may be due to my amateur CSS skills.
I have an apex:inputcheckbox and all I want is, when someone selects this checkbox, the CSS of accompanying should change i.e., just to show this one is highlighted. Just want to make it bold and different colour. Here is my sample:
<apex:pageBlockSectionItem > <apex:inputCheckbox value="{!Dept2}" label="">Elektron <apex:actionsupport event="onchange" action="{!getSomething}" rerender="working" /> </apex:inputCheckbox> </apex:pageBlockSectionItem>
The inputcheckbox is a subsection in pageBlockSectionItem. There are 10 items for the user to select and I want to highlight which one he has selected. When I display "Elektron" in the label, it doesn't show you up on the screen.
The function getSomething is an apex page-reference function and displays result in another PageBlockSection depending upon user selection
It doesn't matter if we use jquery or not, although I believe this can be achieved without query.
Many thanks in advance.
Hi,
This can be done. You can apply style both to a checkbox field borders. Try the following,
<apex:page standardController="Account" >
<apex:form id="working">
<apex:pageblock>
<apex:inputcheckbox value="{!Account.Check__c}" rendered="{!Account.Check__c == false}"> //This will just retrive the checkbox and font without style.
<apex:outputlabel value="Check box value"/>
<apex:actionsupport event="onchange" rerender="working" />
</apex:inputcheckbox >
<apex:inputcheckbox value="{!Account.Check__c}" rendered="{!Account.Check__c == true}" style="outline: 2px solid green;">
<b><apex:outputlabel style="color:green;" value="Check box value"/></b>
<apex:actionsupport event="onchange" rerender="working" />
</apex:inputcheckbox > //This will render the bold font with checkbox styles applied.
</apex:pageblock>
</apex:form>
</apex:page>
In the above example code, I have a check box field on Account object named 'Check__c'. So, to apply styles to that field you can use the outline: 2px solid green;, It has two renders, if checkbox is selected or not selected, both will give different outputs.
Hope so this helps you...!
Please mark this answer a Solution and please give kudos by clicking on the star icon, if you found this answer as helpful.
Regarding CSS selector and Javascript side. I have two table primary and secondary. I want to retrieve the Product Info from primary table and show from secondary table. The Wrapper logic is completed, however, I need to display multiple selection based on one or more Products. Here is the Partial visualforce page and the apex method.
I am trying to perform this logic to refresh a checkbox based on specific selected filter values regardless any approaches using CSS or JavaScript.
I am waiting from anyone to answer this question regardless the @kmccoll and @TehNrd. How can complete and avoid this issue basically to have a Specific Salesforce Record based on the selection of the Product Checkbox.
Please, follwing is the related business scenario for this issue:
Apex code:
Javascript Code:
Any helps will be appreciate in advance.
Thanks.