Create Dynamic Picklists in Salesforce sControls

Have you ever created an sControl and needed to use a picklist? If you've done this and hard-coded the picklist values into the sControl code then you understand that it can be a pain if the picklist options (or business requirements) change.

If your a consultant or contractor and you hard-code those picklist options then it can be additional work when the client wants to make any changes. However, code practices dictate that you should always provide the client with ease of use in your original code. This would mean allowing picklist options to be dynamically generated based upon the picklict options dictated in the field setup with the salesforce.om application itself.

My sample code includes a function that you can reuse to pull picklist values from a specific object as dictated by the values used in the call to the function. That code is below:

//returns an array of picklist values for the passed table and field
function getPickVals(table,field) {
	var returnArray = new Array(); //return array holding all values
	var oTable = sforce.connection.describeSObject(table); //connect to table
	var oFields = oTable.fields; //look at fields on table
	for (var a=0; a<oFields.length; a++) { //loop through all the fields
		if (oFields[a].name==field) { //if the field is the requested one
			var oPicklistVals = oFields[a].picklistValues; //look at all the picklist values for field
			for (var b=0; b<oPicklistVals.length; b++) { //loop through all picklist values
				returnArray.push(oPicklistVals[b].value); //push all picklist options to return array
			}
			break; //we found field and picklist values so exit loop
		}
	}
	return returnArray; //send back data
}

So using the code above you could make a call for the picklist values for Time Zone from the User object. See below:

var picklistValues = getPickVals("User","TimeZoneSidKey"); //build array of values
alert(picklistValues); //alert array to user

Below I've listed the full code, which you can copy & paste into a new sControl within your salesforce instance to test what I've told you & learn more:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
	<title>Dynamic Picklist Select</title>
<!--
	Created by: Greg Hacic
	Last Update: September 06, 2007 by Greg Hacic
	Questions?: greg@interactiveties.com
	Copyright (c) 2007 Interactive Ties LLC
	
	NOTES:
		This sControl will dynamically build any picklist as long as the salesforce.com field
		is a single or multi select picklist.
		
		To test this functionality for other picklists simply change the selTable value to the
		Object you want and change the selField value to a picklist field on the table listed
		in selTable.
-->
<!-- common styles --><link href="/sCSS/10.0/Theme2/default/common.css" type="text/css" media="handheld,print,projection,screen,tty,tv" rel="stylesheet">
<!-- custom styles --><link href="/sCSS/10.0/Theme2/allCustom.css" type="text/css" media="handheld,print,projection,screen,tty,tv" rel="stylesheet">
<!-- AJAX Toolkit version 10.0 --><script src="/soap/ajax/10.0/connection.js" type="text/javascript"></script>
<script language="JavaScript" type="text/javascript">
//intiates page and loads data
function pageInit() {
	var selTable = "User";
	var selField = "TimeZoneSidKey";
	var picklistValues = getPickVals(selTable,selField);
	var plHTML = "<select id=\"picklistSelect\"><option value=\"\" selected>All</option>";
	for (var a=0; a<picklistValues.length; a++) {
	   plHTML += "<option value=\""+picklistValues[a]+"\">"+picklistValues[a]+"</option>";
	}
	plHTML += "</select>";
	document.getElementById("plVals").innerHTML = plHTML;
	document.getElementById("fieldName").innerHTML = "<span class=\"requiredMark\">*</span>"+selField;
	document.getElementById("fieldText").innerHTML = "Field: "+selField+"<span class=\"titleSeparatingColon\">:</span>";
	document.getElementById("objectText").innerHTML = "Object: "+selTable;
}

//returns an array of picklist values for the passed table and field
function getPickVals(table,field) {
	var returnArray = new Array(); //return array holding all values
	var oTable = sforce.connection.describeSObject(table); //connect to table
	var oFields = oTable.fields; //look at fields on table
	for (var a=0; a<oFields.length; a++) { //loop through all the fields
		if (oFields[a].name==field) { //if the field is the requested one
			var oPicklistVals = oFields[a].picklistValues; //look at all the picklist values for field
			for (var b=0; b<oPicklistVals.length; b++) { //loop through all picklist values
				returnArray.push(oPicklistVals[b].value); //push all picklist options to return array
			}
			break; //we found field and picklist values so exit loop
		}
	}
	return returnArray; //send back data
}
</script>
</head>
<body class="Custom184Tab detailPage" onLoad="pageInit();">
<table border="0" cellspacing="0" cellpadding="0" width="100%">
	<tr>
		<td>
			<div class="bPageTitle">
				<div class="ptBody secondaryPalette"><div class="content"><img src="/servlet/servlet.ImageServer?id=0153000000084iV&oid=00D300000001L5c&lastMod=1179974461000" alt="Home" class="pageTitleIcon userDefinedImage"><h1 class="pageType">iTies Examples<span class="titleSeparatingColon">:</span></h1><h2 class="pageDescription"> Dynamic Picklist</h2><div class="blank">&nbsp;</div></div><div class="links">&nbsp;<!--<a href="#" title="Help for this Page"><span class="helpLink">Help for this Page</span><img src="/s.gif" alt="" class="helpImage" title=""></a>--></div></div>
			</div>
			<div class="bPageBlock bEditBlock secondaryPalette"><div class="pbHeader"><table border="0" cellpadding="0" cellspacing="0"><tr><td class="pbTitle"><img src="/s.gif" alt="" width="1" height="1" class="minWidth" title=""><h2 class="mainTitle" id="objectText">&nbsp;</h2></td><td class="pbButton" id="buttonsTop">&nbsp;</td></tr></table></div>
			<div class="pbBody">
				<div class="pbSubheader first tertiaryPalette"><h3 id="fieldText">Information<span class="titleSeparatingColon">:</span></h3></div>
					<div class="pbSubsection">
						<table class="detailList" border="0" cellpadding="0" cellspacing="0">
							<tr>
								<td class="labelCol last requiredInput"><label for="field" id="fieldName"><span class="requiredMark">*</span>Loading...</label></td>
								<td class="data2Col last" colspan="3"><div class="requiredInput"><div class="requiredBlock"></div><div id="plVals" name="plVals"></div></div></td>
							</tr>
							<tr>
								<td class="labelCol last empty">&nbsp;</td>
								<td class="dataCol col02 last empty">&nbsp;</td>
								<td class="labelCol last empty">&nbsp;</td>
								<td class="dataCol last empty">&nbsp;</td>
							</tr>
						</table>
					</div>
				</div>
				<div class="pbBottomButtons"><table border="0" cellpadding="0" cellspacing="0"><tr><td class="pbTitle"><img src="/s.gif" alt="" width="1" height="1" class="minWidth" title="">&nbsp;</td><td class="pbButtonb" id="buttonsBottom">&nbsp;</td></tr></table></div>
				<div class="pbFooter secondaryPalette"><div class="bg"></div></div>
			</div>
		</td>
	</tr>
</table>
</body>
</html>

Hopefully, you can find many uses for this script as I have made use of it in many sControls.

Automated Exchange Rates in Salesforce.com

Reduce Repetitive Tasks, Eliminate Errors & Free Up Your Administrators.

Birthday Reminders for Salesforce.com

It might lead to a sale. Or it might make you feel good.