Validations Over Checkboxes List in VisualForce Page?

Question

In Visualforce page, I am displaying the list of permissions as checkboxes.

<apex:selectCheckboxes layout="pageDirection" value="{!userPermission}">
        <apex:selectOptions value="{!AllPermissions}"><br /></apex:selectOptions>
</apex:selectCheckboxes>

Here userPermission is a String variable and AllPermissions are the list of Permission__c object. It is displaying the list of all permissions. see the screenshot below : Now what i need to ask you is ,for example when any user clicks on "verify invoices" then "view invoice" options should automatically selected. how will i achieve this functionality over dynamically generated checkboxes.

How can i get to know id of selected checkboxes on the visualforce page at run time ? and how can i apply onselect function over specific checkbox ?

Followed the code steps :

1. Created the Developer__c field in the Permission__c Object with assigning some values to it.

2. Earlier I was adding the Id and PermissionName__c to the List but now I have added DeveloperID__c and PermissionName__c instead of ID.

   List<SelectOption> listPermission = new List<SelectOption>();
   for(Permission__c per : allPermissions) {
       listPermission.add(new SelectOption(per.DeveloperId__c,per.PermissionName__c));
   }
   return listPermission;
   

3. Visual Force page code is same as above written

4. After rendering this page on the browser and developer id and name looks like

Now the problem is , how to get checkbox element in javascript so that i can apply some logic on particular permission checkbox. and Developer id is coming into value field, i want this developer field should become in "Id" attribute.

please reply as soon as possible.

Answer 1

Since your values come from Permission__c there you might already have a name which you are displaying as label (I assume Label__c). Now you could add the a field at Permission__c called DeveloperId__c and use a short version of the label without spaces and special characters.

You can set the Id if you use an <apex:repeat> to generate single <apex:selectOption> tags. Therefore you need to query you Permission__c into a property, eg. permissions.

<apex:repeat value="{!permissions}" var="permission" >
     <apex:selectOption id="{!permission.DeveloperId__c}" itemValue="{!permission.Label__c}" itemLabel="{!permission.Label__c}" />
</apex:repeat>

But be aware that the Id in Salesforce get mangled and you will end up with strange prefixes. I prefer in most cases to use styleClass instead which is also supported by <apex:selectOption> http://www.salesforce.com/us/developer/docs/pages/Content/pages_compref_selectOption.htm

<apex:selectOption styleClass="{!permission.DeveloperId__c} yourRealCSSClass" itemValue="{!permission.Label__c}" itemLabel="{!permission.Label__c}" />

Since more than one html-class is allowed (space separated) in styleClass, you can add your "real" CSS class too (in this example yourRealCSSClass). Therefore remember not to use spaces in your DeveloperId__c!

To trigger changes and implement logic I would use jquery to trigger check/uncheck for the checkboxes http://api.jquery.com/change/

If you want to bind a handler on all boxes you can do it like

$( ".yourRealCSSClass" ).change(function() {
    alert( "Your logic goes here" );
});

Answer 2

onclick="seletfuntion(this);"

seletfuntion(val) { alert(val.value); }

when you pass this as param in function it will give you selected checkbox value and then perform your validation .

If you have to check on submit validation that any of checkbox is selected then use below script if($(".testClass:checked").length == 0) { alert('Please select at least one check box'); }