Saturday, 26 July 2014

Select All CheckBox using Jquery in visualforce page

We have many requirements to have "Select All " records in visualforce page. We can achieve this through the javascript and Jquery.

If we choose jquery we can reduce the lines of code in javascript and we can easily get the functionality.

<apex:page controller="MassUpdateAllcls" sidebar="false">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $("#parentCheck").click(function() {
                $(".childCheck").prop('checked', this.checked);
                
            });
            $(".childCheck").click(function(){
                if ($('input.childCheck[type=checkbox]:not(:checked)').length){
                    $("#parentCheck").removeAttr('checked');    
                }else{
                    $("#parentCheck").prop('checked',true);
                }
            });
        })
    </script>
      <apex:form >
          <apex:pageBlock >
              <apex:pageBlockTable value="{!accountWrapperList}" var="actWrap">
                  <apex:column >
                      <apex:facet name="header">
                         <input type="checkbox" id="parentCheck"/>
                      </apex:facet>
                      <apex:inputCheckbox value="{!actWrap.isSelect}" styleClass="childCheck"/>
                  </apex:column>
                  <apex:column headerValue="Account Name" value="{!actWrap.actobj.Name}"/>
              </apex:pageBlockTable>
          
          </apex:pageBlock>
      </apex:form>
</apex:page>

Output:
====

No comments:

Post a Comment

Create Dynamic Picklists for Your Custom Components (design:component)

Hi, We can expose a component property as a picklist when the component is configured in the Lightning App Builder. The picklist’s value...