0

I am trying to check all checkbox but its not working.

<head>

<apex:includeScript value="//code.jquery.com/jquery-3.2.1.min.js" />
<apex:includeScript value="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js" />
<apex:includeScript value="{!URLFOR($Resource.Others,'/Others/JQuery_File/jquery-2.2.4.min.js')}" />
<apex:slds />
<script>
    $(document).ready(function() {
        $('#myButton').click(function() {
            $('.slds-checkbox').attr('checked', 'true');
        });
    });
</script>
</head>

<apex:form>
    <br/>
    <div id="example">

        <apex:commandButton id="myButton" styleClass="slds-button slds-button--brand" value="Select All " />

        <body class="slds-scope">
            <div class="slds-grid slds-wrap slds-grid--pull-padded slds-form--horizontal">
                <div class="slds-form-element slds-p-horizontal--small slds-size--1-of-1 slds-large-size--1-of-4">
                    <div class="slds-form-element" style="align:center;">
                        <div class="slds-form-element__control">
                            <span class="slds-checkbox">
                                <input type="checkbox" name="options" id="PDCheck" checked="" />
                                <label class="slds-checkbox__label" for="PDCheck">
                                    <span class="slds-checkbox_faux"></span>
                                    <span class="slds-form-element__label">Draphic</span>
                                </label>
                            </span>
                        </div>
                    </div>

                    <div class="slds-form-element" style="align:center;">
                        <div class="slds-form-element__control">
                            <span class="slds-checkbox">
                                <input type="checkbox" name="options" id="PICheck" checked="" />
                                <label class="slds-checkbox__label" for="PICheck">
                                    <span class="slds-checkbox_faux"></span>
                                    <span class="slds-form-element__label">Insurence</span>
                                </label>
                            </span>
                        </div>
                    </div>
                </div>
            </div>
        </body>
    </div>
</apex:form>
2
  • 2
    I assume you're using javascriot for checking the checkboxes. Can you post your code so we can correct it? Also your button has no action so it won't do anything.
    – Laszlo
    Jun 16 '17 at 7:36
  • Yes I am using Jquery please check edits.
    – avidForce
    Jun 16 '17 at 7:55
2

To start of with you have included 2 versions of jquery. either the first line or third line is not needed. you will have 2 different versions of jquery running.

<apex:includeScript value="//code.jquery.com/jquery-3.2.1.min.js" />
<apex:includeScript value="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js" />
<apex:includeScript value="{!URLFOR($Resource.Others,'/Others/JQuery_File/jquery-2.2.4.min.js')}" />

Second: if you are going to call a jquery click function dont use apex:command button rather use a html button.

 <button id="myButton" type="button" styleClass="slds-button slds-button--brand" value="Select All ">Click Me</button>  

Third in your function for the click handler you are trying to set checked attribute on the class 'slds-checkbox' which is on a span. your checkbox is your input which is a child of it so the function should be the below one

 $('#myButton').click(function() {
            var abc = $('input[type="checkbox"]');
            for(var i=0;i<abc.length;i++){ abc[i].checked = true;}
        });
1
  • But it still not working.
    – avidForce
    Jun 16 '17 at 12:53

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