Edit and Delete Command For Datatable In Visualforce

i write the Apex Class and Visual force Page for Edit and Delete the Records in Account Page.


Visual Force Page:

<apex:page controller="DataTableEditRemoveController">

<apex:form id="form" >
<apex:pageBlock title="Accounts">
  <apex:pageMessages ></apex:pageMessages>
  <apex:pageBlockTable value="{!accs}" var="row">
     <apex:column >
       <apex:outputLink title="" value="/{!row.id}/e?retURL=/apex/{!$CurrentPage.Name}" style="font-weight:bold">Edit</apex:outputLink>&nbsp;|&nbsp;
       <a href="javascript:if (window.confirm('Are you sure?')) DeleteAccount('{!row.Id}');" style="font-weight:bold">Del</a>
     </apex:column>
     <apex:column value="{!row.Name}"/>
     <apex:column value="{!row.BillingStreet}"/>
     <apex:column value="{!row.BillingCity}"/>
     <apex:column value="{!row.BillingPostalCode}"/>
     <apex:column value="{!row.BillingCountry}"/>
  </apex:pageBlockTable>
</apex:pageBlock>

<apex:actionFunction action="{!DeleteAccount}" name="DeleteAccount" reRender="form" >
   <apex:param name="accountid" value="" assignTo="{!SelectedAccountId}"/>
</apex:actionFunction>
</apex:form>
</apex:page>

How It Is Done For Edit Action:

Since the standard Account edit page is good enough for me I used an outputLink component to link the record to its Standard Edit page. In Salesforce for standard objects you can follow this format to get the URL for their edit page: /{RecordId}/e

I also wanted this to work in such a way that would return the user back to my Visualforce page once the user clicks on "save" or "cancel" in the Account edit page. In order to do that I need to add the following to the URL: /{RecordId}/e?retURL={returnURL}

In the Page's source code (above) you see that for return URL I have used {!$CurrentPage.Name} merge field, where I could simply put my page name. I like writing code clean! By doing this if you later on decided to change your page name, you do not need to worry about breaking anything! You page will continue to work with no problems!

How It Is Done For Delete Action:

In order to support this action in your page you need to do a bit of coding. The key is to be able to find out which account was selected by the user to be deleted.

In this example I have used a actionFunction component that triggers a Controller's Apex method call "DeleteAccount".

Before getting more into the coding part I wanted this link to get a confirmation from the user about deleting the record before actually we remove it.

In order to do so, we need to use a little bit of Javascript "window.confirm", the javascript function returns true if the user clicks on OK and false if the user selects "Cancel".

In order to capture the user's selection as to which account should be deleted I have added a "param" tag to the actionFunction component which passes the Account ID to the controller and as soon as user clicks on the link.

Now let's take a look at the code:

Controller :

public class DataTableEditRemoveController {

   public List<Account> accs { get; set; }
  
   //used to get a hold of the account record selected for deletion
   public string SelectedAccountId { get; set; }
  
   public DataTableEditRemoveController() {
       //load account data into our DataTable
       LoadData();
   }
  
   private void LoadData() {
       accs = [Select id, name, BillingStreet, BillingCity, BillingPostalCode, BillingCountry from Account limit 20];
   }
  
   public void DeleteAccount()
   {
      // if for any reason we are missing the reference 
      if (SelectedAccountId == null) {
      
         return;
      }
     
      // find the account record within the collection
      Account tobeDeleted = null;
      for(Account a : accs)
       if (a.Id == SelectedAccountId) {
          tobeDeleted = a;
          break;
       }
      
      //if account record found delete it
      if (tobeDeleted != null) {
       Delete tobeDeleted;
      }
     
      //refresh the data
      LoadData();
   }    
  
  
}