Friday, December 18, 2009

Creating a multilevel dependent picklist on Visualforce inside a Data table

Recently on working on a project I cam across a serious issue, creating a multilevel picklist with N-Level dependency.
e.g., Picklist one, select option, picklist two displays related values, select a value and the data for Picklist 3 are filtered based on picklist 1 and 2 and this goes on.
Lets increase the complexity a bit, you want to have this functionality in a data table with multiple rows.

The code for this seems tricky, but I did manage to write some.

The trick is create a wrapper class within you Apex:Class and bind it with the SelectList.

VF Page:

<apex:actionRegion >
<apex:pageBlockSection id="theSection" rendered="{!noLob}"> 
<apex:dataTable value="{!packages}" var="field" id="thetable" cellpadding="3px" id="dt">
<apex:column headerValue="Action">
<apex:CommandButton action="{!copyRow}" value="Copy" rerender="theSection" status="pleasewait">
<apex:param name="Assignment" Assignto="{!SelIndex}" value="{!field.index}"/>
</apex:CommandButton> 
</apex:column> 
<apex:column headerValue="Product Group">
<apex:selectList value="{!field.level1}" size="1" >
<apex:selectOptions value="{!field.level1Options}" /> 
<apex:actionSupport event="onchange" reRender="level2" status="pleasewait"> 
</apex:actionSupport>               
</apex:selectList>   
</apex:column>   
<apex:column headerValue="Products" >  
<apex:selectList id="level2" value="{!field.level2}" size="1" disabled="{!field.disable_level2}">
<apex:selectOptions value="{!field.level2Options}"/>     
</apex:selectList>  
</apex:dataTable>

And now the controller:

public class AddNewProductsController { 
public class myObject{
 public string level1 {get;set;} // The selected Level1 value in the Product Picklist on the modal panel
 public string level2 {get;set;}// The selected Level2 value in the Product Picklist on the modal panel
 public boolean disable_level2{get;set;}// The determines if Level2 value in the Product Picklist is disabled
 public boolean disable_level3{get;set;}// The determines if Level3 value in the Product Picklist is disabled
 public boolean FormRendered{get;set;}
 public myObject(){
 }
 public List getLevel1Options(){
 List options = new List();
 Options.add(new SelectOption('','--None--'));
 Options.add(new SelectOption('Product Group 1','Product Group 1')); 
Options.add(new SelectOption('Product Group 2','Product Group 2')); 
 Options.add(new SelectOption('Product Group 3','Product Group 3')); 
 Options.add(new SelectOption('Product Group 4','Product Group 4')); 
 return options;
 }
 
 public List getLevel2Options(){
 List options = new List();
 System.debug('==========='+level1+'%%%%%%%%%');
 options.add(new SelectOption('', '--None--')); 
 disable_level2=false;
 
 if(level1 == 'Product Group 1'){
 options.add(new SelectOption('Product1', 'Product1'));
 options.add(new SelectOption('Product2', 'Product2'));
 }else if(level1 == 'Product Group 2'){
 options.add(new SelectOption('Product1', 'Product1'));
 options.add(new SelectOption('Product15', 'Product15'));
 }else if(level1 == 'Product Group 3'){
 options.add(new SelectOption('Product2', 'Product2'));
 options.add(new SelectOption('Product23', 'Product23'));
 }else if(level1 == 'Product Group 4'){
 options.add(new SelectOption('Product16', 'Product16'));
 options.add(new SelectOption('Product12', 'Product12'));
 }else if(level1 == 'Product Group 5'){
 options.add(new SelectOption('Product16', 'Product16'));
 options.add(new SelectOption('Product1', 'Product1'));
 }else{
 disable_level2=true;
 }
 return options;
 }
}

This code will do your trick.

Hope it helps,
Cheers.
SiD

Tuesday, December 1, 2009

Google Gears up for HTML5

I am not that big fan of Google, (ok I am lying, who isn't a fan of Google?) But you like them or No, one thing you must agree, they are technology savvy and not money-power hungry, good for poor developers like me.

Google always came up with something new to surprise us and even if they did not intend to surprise us, we do get surprised with their announcements.
Devta
Google has announced that is it dumping Google Gears for HTML 5, which is a surprise yet a technically sound move.

With Google Gears, they had to build it compatible around every browser which was a headache for Google but if they do have the same technology around HTML 5, then I every browser compatible with HTML 5 will have offline access to Google products.

ReadWriteWeb says, "We question whether offline access is even necessary. After all... in today's world, you're never too far from an internet connection. We concluded that offline access is important now, but less important with each passing day." more here.

However, this sentence may be true for US and UK, but really the world is more than just that, infact most of the Google products are used in India (where I belong) that other countries. There are many places where offline access is necessary. When I was consulting a client on Salesforce, his major requirement was that the sales rep travel to the part of the world which has limited internet access. A company dealing with metric TONs of iron ore may not exactly use internet or has time to study internet. They use their MIS system is enought for them presently. So ReadWriteWeb, if you are listening, the world is very large and the internet is not yet wide spread around the world, and we do need offline access.

So, moving over Google Gears, I am enjoying Google Wave with Elizabot, for those who do not know her, a new post is coming up soon.

Till then wait for the next update.

Cheers,
Ravan