I am trying to manipulate multiple row selections using jQuery DataTables checkboxes plugin in Visualforce Page(Salesforce).But am having issues in getting selected rows from Visualforce Page to apex controller. I am getting c.selected = false in apex controller. Here is the link to jQuery DataTables checkboxes plugin. https://www.gyrocode.com/projects/jquery-datatables-checkboxes
public class DataTableExampleController {
public Boolean selected {get; set;}
public List<Contact> contactList {get;set;}
public List<cWrapper> cListWrapper {get;set;}
public DataTableExampleController(){
contactList = [SELECT Account.Name, FirstName, LastName,Description, Phone FROM Contact limit 1000];
cListWrapper = new list<cWrapper>();
for(Contact c: contactList) {
cListWrapper.add(new cWrapper(c));
}
}
public class cWrapper {
public Contact con {get; set;}
public Boolean selected {get; set;}
public cWrapper(Contact c) {
con = c;
selected = false;
}
}
public PageReference reset() {
PageReference pg = new PageReference(System.currentPageReference().getURL());
pg.setRedirect(true);
return pg;
}
public PageReference processSelected(){
list<Contact> selectedContacts = new List<Contact>();
for(cWrapper c: cListWrapper) {
if(c.selected == true) {
selectedContacts.add(c.con);
}
}
for(Contact c: selectedContacts) {
c.Description = 'TEST';
}
update selectedContacts;
return null;
}
}
<apex:page Controller="DataTableExampleController">
<apex:form>
<head>
<apex:includescript value="https://code.jquery.com/jquery-1.11.1.min.js" / >
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/dt/dt-1.10.18/r-2.2.2/rg-1.0.3/sl-1.2.6/datatables.min.css"/>
<script type="text/javascript" src="https://cdn.datatables.net/v/dt/dt-1.10.18/r-2.2.2/rg-1.0.3/sl-1.2.6/datatables.min.js"></script>
<link type="text/css" href="//gyrocode.github.io/jquery-datatables-checkboxes/1.2.11/css/dataTables.checkboxes.css" rel="stylesheet" />
<script type="text/javascript" src="//gyrocode.github.io/jquery-datatables-checkboxes/1.2.11/js/dataTables.checkboxes.min.js"></script>
<script>
j$ = jQuery.noConflict();
j$(document).ready(function () {
var conTable = j$('[id$="contacttable"]').DataTable({
"pageLength": 50,
'columnDefs': [{
'targets': 0,
'checkboxes': {
'selectRow': true
},
"orderable": false
}
],
'select': {
'style': 'multi'
}
});
});
</script>
</head>
<apex:pageBlock>
<apex:pageBlockButtons location="top">
<apex:outputPanel layout="none" id="buttonsPanel">
<apex:commandButton value="Update Contacts" action="{!processSelected}">
</apex:commandButton>
<apex:commandButton value="Reset" action="{!reset}" immediate="true"/>
</apex:outputPanel>
</apex:pageBlockButtons>
<body>
<table id="contacttable" class="display">
<thead>
<tr>
<th><apex:inputCheckbox/></th>
<th>Account</th>
<th>First Name</th>
<th>Last Name</th>
<th>Phone</th>
</tr>
</thead>
<tbody>
<apex:repeat value="{!cListWrapper}" var="c">
<tr>
<td><apex:inputCheckbox value="{!c.selected}" id="inputId"/></td>
<td>{!c.con.Account.Name}</td>
<td>{!c.con.FirstName}</td>
<td>{!c.con.LastName}</td>
<td>{!c.con.Phone}</td>
</tr>
</apex:repeat>
</tbody>
</table>
</body>
</apex:pageBlock>
</apex:form>
</apex:page>
Aucun commentaire:
Enregistrer un commentaire