2

I have a checkbox on my VF page, with the label in a <TD> element of the table, and the checkbox in a <TD> element next to it like this:

<tr>
       <td class="LeftColumnTop W50" title="{!$ObjectType.Request_for_System_Change__c.fields.BOC_dormant_account__c.inlineHelpText}"
        onclick="checkIt('inMailshot_BOC_dormant_account__c')">
        <font class="MainPanelFont">
                <apex:outputLabel value="{!$ObjectType.Request_for_System_Change__c.fields.BOC_dormant_account__c.Label}"/>
                <apex:actionFunction name="onclick" action="checkIt('inMailshot_BOC_dormant_account__c')"/>
            </font>
       </td> 
        <td class="RightColumnTop W50" title="{!$ObjectType.Request_for_System_Change__c.fields.BOC_dormant_account__c.inlineHelpText}">                                                                    
            <div class="Mandatory">
                <apex:inputCheckbox styleClass="MainPanelFont"
                    id="inMailshot_BOC_dormant_account__c" 
                    value="{!sObjectRFC.BOC_dormant_account__c}"/>
            </div>
        </td>
    </tr>

For extra usability I'd like to have a click event on the <apex:outputLabel value or the <TD> container that will toggle the Checked/unchecked state of the checkbox. This will enable the user to just click the label for the checkbox to change it's value...

I have this method in a <SCRIPT> tag on the page:

function checkIt(string elementId){
    alert("checkIt" + elementId);
    if (document.getElementById(elementId).checked==true){
        document.getElementById(elementId).checked=false;
    }else {
        document.getElementById(elementId).checked==true;
    }
}

but unfortunately, even though it compiles and saves ok, the event is not being raised (no alert or anything)

What is the correct way to do this in a VF page?

2

Simple way use for attribute of apex:ouputlabel and pass the id

<apex:outputLabel value="Checkbox" for="theCheckbox"/>
<apex:inputCheckbox value="{!inputValue}" id="theCheckbox"/>

Let me know if this solved your problem or not

| improve this answer | |
  • another DOH moment, I used to use this in my classic ASP and DMTL DOM all the time...thanks! – Our Man in Bananas Jan 27 '16 at 12:44

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.