My Controller:
public class AccountEditController {
public String closePopup { get; set; }
accountwrapper1 makeEdit;
List<accountwrapper1> listAccount = new List<accountwrapper1>();
List<Account> selectableAccount = new List<Account>();
//set<Account> selectableAccount2 = new set<Account>();
//public Boolean showPanel {get; set;}
public Boolean showPopup { get; set; }
public AccountEditController() {
showPopup = False;
//showPanel = False;
}
public List<accountwrapper1> getAccounts() {
if(listAccount == Null){
for(Account a: [SELECT Id, Name, BillingCountry, Phone FROM Account])
listAccount.add(new accountwrapper1(a));
return listAccount; }
else{
listAccount.clear();
for(Account a: [SELECT Id, Name, BillingCountry, Phone FROM Account])
listAccount.add(new accountwrapper1(a));
return listAccount;
}
}
public PageReference showToPopup() {
// public PageReference showToPanel() {
showPopUp = True;
return Null;
//showPanel = True;
}
public PageReference getSelectable() {
system.debug('Hello');
selectableAccount.clear();
for(accountwrapper1 accwrapper : listAccount)
if(accwrapper.selected == True)
selectableAccount.add(accwrapper.acc);
system.debug(selectableAccount);
return Null;
}
public string BillingCountry {
get;
set;
}
/*public PageReference Savemeth() {
for(account acc :selectableAccount ) {
acc.BillingCountry = BillingCountry;
selectableAccount2.add(acc);
}
update selectableAccount2;
showPopup = False;
return Null;
}*/
public PageReference Savemeth()
{
map<Id, Account> mapAccountForUpdate = new map<Id, Account>();
for(account acc :selectableAccount )
{
system.debug('BillingCountry: '+BillingCountry);
acc.BillingCountry = BillingCountry;
mapAccountForUpdate.put(acc.Id, acc);
}
update mapAccountForUpdate.values();
selectableAccount = new List<Account>();
showPopup = Null;
BillingCountry = '';
//showPopup = False;
return null;
}
public PageReference cancelmeth() {
return Null;
}
public PageReference closePopup() {
showPopup = Null;
BillingCountry = '';
//showPopup = False;
return Null;
}
public PageReference GetSelectedAccounts()
{
if(selectableAccount.size()>0) {
system.debug(selectableAccount.size());
system.debug(selectableAccount);
showPopup = Null;
return Null;
}
else
showPopup = Null;
return Null;
}
public class accountwrapper1
{
public Account acc{get; set;}
public Boolean selected {get; set;}
public accountwrapper1(Account a)
{
acc = a;
selected = False;
}
}
}
Here the code is for the providing the list of account to the updating manner in the field of the billing country of the account.by the selecting to the check box value of the is "True" that appropriate account is to be updated.here the updated value s to be desired by the input of the model popup box in the billing country field.
My Page:
<apex:page controller="AccountEditController" applyHtmlTag="true">
<head>
<apex:includeScript value="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" />
</head>
<script>
$(document).ready(function(){
select();
});
function select(){
$('[id*=chkb1]').change(function(){
$("[id*='chkb2']").attr("checked",this.checked);
getSelectable();
});
$('[id*=chkb2]').click(function(){
if($('[id*=chkb2]').length== $("[id*='chkb2']: checked").length)
{
$("[id*='chkb1']").attr("checked",this.checked);
getSelectable();
}
else
{
var checkboxes = document.getElementsByTagName('input');
var counter = 0;
var counter1 = 1;
for (var i = 0; i < checkboxes.length; i++) {
if (checkboxes[i].type == 'checkbox') {
counter++;
if(checkboxes[i].checked == true){
counter1++;
}
}
}
if(counter==counter1){
$("[id*='chkb1']").attr("checked",this.checked);
getSelectable();
} else {
$("[id*='chkb1']").removeAttr("checked");
getSelectable();
}
}
});
}
</script>
<style type="text/css">
.PopupBackground{
background-color: white;
opacity: 0.8;
filter: alpha(opacity = 20);
position: absolute;
width: 100%;
height: 200%;
top: -100px;
left: 10px;
z-index: 9998;
}
.AccountEdit{
background-color: white;
border-width: 8px;
border-style: solid;
z-index: 9999;
left: 30%;
padding:10px;
position: absolute;
width: 350px;
margin-left: 75px;
top:300px;
}
</style>
<apex:form >
<apex:actionFunction name="getSelectable" action="{!getSelectable}" reRender="Output"/>
<apex:pageBlock Title="List of Accounts" >
<apex:pageBlockButtons location="top">
<apex:commandButton value="Get selected Records" action="{!showToPopup}" rerender="Output" id="button"/>
<apex:commandButton value="Cancel" action="{!closePopup}" rendered="output"/>
<!-- <apex:commandButton value="Get selected Records" action="{!showToPanel}" rerender="Output" id="button"/>---->
</apex:pageBlockButtons>
<!-- {!showPanel}---->
<apex:outputPanel id="Output">
<apex:outputPanel styleClass="PopupBackground" layout="black" rendered="{!showPopup}">
<apex:outputPanel styleClass="AccountEdit" layout="black" rendered="{!showPopup}">
<!--- <apex:outputPanel rendered="{!showPanel}">----->
<!---{!showPanel}---------->
<apex:outputLabel value="BillingCountry: "></apex:outputLabel>
<apex:inputText id="BillingCountry" value="{!BillingCountry}" size="40" style="height:13px;font-size:11px;"/><br />
<center><apex:commandButton value="Save" action="{!Savemeth}" reRender="Initialtable,Output" oncomplete="select();"/>
<!-- <apex:commandButton value="cancel" action="{!cancelmeth}"/>---->
<apex:commandButton value="Cancel" action="{!closePopup}"/></center>
</apex:outputPanel>
</apex:outputPanel>
</apex:outputPanel>
<!-- <apex:commandButton value="cancelPopup" action="{!closePopup}"/>--->
<apex:pageBlockSection Title="List of Available Accounts" columns="1" collapsible="true">
<apex:pageblockTable value="{!accounts}" var="a" id="Initialtable">
<apex:column >
<apex:facet name="header">
<apex:inputCheckbox value="{!a.selected}" id="chkb1">
<!-- <apex:actionSupport event="onclick" action="{!getSelectable}" reRender="Output"/> -->
</apex:inputCheckbox>
</apex:facet>
<apex:inputCheckbox value="{!a.selected}" id="chkb2" />
<!-- <apex:actionSupport event="onclick" action="{!getSelectable}" reRender="Output"/> -->
</apex:column>
<apex:column headervalue="Account Name" value="{!a.acc.Name}" width="200"/>
<apex:column headervalue="Phone" value="{!a.acc.Phone}" width="300"/>
<apex:column headervalue="Billing Country" value="{!a.acc.BillingCountry}" width="300"/>
</apex:pageblocktable>
</apex:pageBlockSection>
</apex:pageblock>
</apex:form>
</apex:page>
So here the my page I want in here the "Get selected records" button is there so It's should be enable in the condition of the atleast the one check box are to be selected in. And also it's should be disable in the condition of the there is no check box are in select mode.(Note:Please tell the execution flow in the jquery as your written it's help to understand clearly in my point of view) So please help me to done this function for answers thanks in advance.
if i understand your purpose you can get a variable for counting check boxes are checked.
$(document).ready(function() {
$('.btn').prop('disabled', true);
});
var chbchecked = 0;
$('.chb').change(function() {
if (this.checked) {
chbchecked++;
$('.btn').prop('disabled', false);
} else {
chbchecked--;
if (chbchecked == 0) {
$('.btn').prop('disabled', true);
}
}
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input type="checkbox" class="chb" value="1" /><a>chb1</a>
<input type="checkbox" class="chb" value="2" /><a>chb2</a>
<input type="checkbox" class="chb" value="3" /><a>chb3</a>
<button type="submit" class="btn">
Save
</button>