Add Cascading Drop-downs To Any SharePoint List or Library

Here is everything you need to add to five cascading drop-down fields to any SharePoint list or library. This can be accomplished in under 30 minutes.

Turn this...
      
Into this...
     

High-level Steps:

1. If you don't already have one, create a list that stores all the allowed combinations for the cascading drop-downs (one column for each level of drop-down). I will refer to this list as the Source Options list.
2. Add 2-5 single line of text columns to the list or library that will hold the values from the cascading drop-down fields. I will refer to this list/library as the Cascading Drop-down list.
3. Modify and upload the JS Link file (supplied below) to a shared library in the same site collection as the Cascading Drop-down list and Source Options list.
4. Download the compressed, production JQuery file and upload it to the same shared library as the JS Link file.
5. Modify the New and Edit form web parts for the Cascading Drop-down list by entering a URL into it's JS Link property.

Assumptions:

• All the lists and JavaScript files reside in the same site collection

Step 1: The Source Options list

This list can be any SharePoint list or external BCS list in the same site collection as the list that will display these choices as cascading drop-downs.  The column names can be whatever you choose so long as you know (or can figure out) what their internal names are. In the example table below, the levels correspond to Continent, Country, State, and City.  You can download this list template if you don't want to create your own from scratch.  If you only need two cascading drop-downs you can ignore Levels 3 and 4.

Level 1	Level 2	Level 3	Level 4
North America	United States	MD	Germantown
North America	United States	MD	Rockville
North America	United States	MD	Silver Spring
North America	United States	VA	Manassas
North America	United States	VA	Arlington
South America	Argentina	Buenos Aires	Buenos Aires
Central America	Costa Rica	San Jose	San Jose
North America	Mexico	Chihuahua	Chihuahua
North America	Mexico	Juarez	Juarez

Step 2: The Cascading Drop-down list/library

This is the list or library that has 2-4 columns which need to be presented as cascading drop-downs. If your list or library doesn't have these columns already just add them (single line of text). I highly recommend creating them with initial names that do not include spaces or special characters. You can rename them later and add the spaces or special characters back in.

Step 3: The JS Link file

Here is where we get into the meat and potatoes of this solution. Download the CascadingDropDowns.js file (what I'm calling the JS Link file) and modify the variables in the first 34 lines to configure it to match your Source Options list and the Cascading Drop-down list/library. These lines are commented pretty well already but I'll summarize here.

• restUrl variable: enter the display name of the Source Options list into the URL that is provided inside the GetByTitle parenthesis. Be sure to include the single quotes around it. For example:
• /_api/web/lists/GetByTitle('My Source Options List')/items
• LevelNInternalName variables: set these to the internal names of each corresponding Cascading Drop-down list/library column. Levels 3 and 4 can be set to an empty string (two double quotes) if they aren't needed. For example:
• var Level1InternalName = "Continent";
• LevelNSource variables: set these to the internal name of the corresponding column in the Source Options list. Levels 3 and 4 can be set to an empty string (two double quotes) if they aren't needed. For example:
• var Level1Source = "Level1";
• cascadingFieldContext.Templates.Fields JSON definition: each first level item needs to match the corresponding LevelNInternalName variable. Do not change "NewForm", "EditForm" or any of the renderLevelNField entries.

Once you have modified those lines, upload this file to a shared library in your site collection such as the Site Assets library.

Step 4: The JQuery file

This solution's JS Link file relies on JQuery and in order for JQuery to be loaded properly it needs to be available somewhere in your site collection. If you don't already have this stored somewhere in your site collection I recommend putting it in the same shared library as the JS Link file. You can download JQuery here.  The JS Link file was built using version 2.2.1.

Step 5: Wire up the JS Link file

If the cascading drop-down is to be used in a library then we only need to do the following on the Edit Properties page. For lists however, the following needs to be done on both the New and Edit Properties pages.

1. Browse to the Edit Properties page
1. You will need to create an item in the Cascading Drop-down list or upload a document to the  Cascading Drop-down library if one does not already exist.
2. Check the box next to the item/document and then click Edit Properties from the Items or Files ribbon menu.                                                                          
2. Browse to the list and click the New Item button at the top to display the New form.
3. Once on the Edit Properties or New form properties page, click the Settings Gear icon at the top right of the page and click the Edit Page option.
4. Click the drop-down arrow at the top right of the form web part and click the Edit Web Part option.                                                                                 
5. Collapse the Appearance web part properties section and expand the Miscellaneous section
6. Enter the following into the JS Link property assuming you put the JQuery and JS Link files
1. ~sitecollection/SiteAssets/jquery-2.2.1.min.js|~sitecollection/SiteAssets/CascadingDropDowns.js
7. Click the Ok button on the Web Part Properties panel.
8. Click the Stop Editing button on the Page ribbon menu.

Conclusion

That's it! Now anyone entering a new item, uploading a new document into your list/library or editing the item or document's properties will have the cascading drop-down functionality. Don't forget to enter all the allowed options in your Source Options list.

	//http://jedcurl.blogspot.com/2016/03/add-cascading-drop-downs-to-any-list-or.html
	(function () {
	//Configurable Values:
	var restUrl="/_api/web/lists/GetByTitle('Cascading Choices')/items";//URL for the Source Options list containing all cascading drop-down options
	var noChoicesText = "[No options available]";
	var maxSourceItems = "2000";
	var Level1InternalName = "Continent";//Cascading Drop-down list's level 1 column name, also update line 19
	var Level2InternalName = "Country";//Cascading Drop-down list's level 2 column name, also update line 23
	var Level3InternalName = "State";//Cascading Drop-down list's level 3 column name, also update line 27, set both to "" if only 2 cascading drop-downs
	var Level4InternalName = "City";//Cascading Drop-down list's level 4 column name, also update line 31, set both to "" if only 3 cascading drop-downs
	var Level5InternalName = "Neighborhood";//Cascading Drop-down list's level 5 column name, also update line 31, set both to "" if only 3 cascading drop-downs
	var Level1Source = "Level1";//internal name of the column containing the level 1 choices in the Source Options list
	var Level2Source = "Level2";//internal name of the column containing the level 2 choices in the Source Options list
	var Level3Source = "Level3";//internal name of the column containing the level 3 choices in the Source Options list, set to "" if only 2 cascading drop-downs
	var Level4Source = "Level4";//internal name of the column containing the level 4 choices in the Source Options list, set to "" if only 3 cascading drop-downs
	var Level5Source = "Level5";//internal name of the column containing the level 5 choices in the Source Options list, set to "" if only 3 cascading drop-downs
	// Create object that have the context information about the field that we want to change it's output render
	var cascadingFieldContext = {};
	cascadingFieldContext.Templates = {};
	cascadingFieldContext.Templates.Fields = {
	// Apply the new rendering for all fields on New and Edit forms
	"Continent": {
	"NewForm": renderLevel1Field,
	"EditForm": renderLevel1Field
	},
	"Country": {
	"NewForm": renderLevel2Field,
	"EditForm": renderLevel2Field
	},
	"State": {
	"NewForm": renderLevel3Field,
	"EditForm": renderLevel3Field
	},
	"City": {
	"NewForm": renderLevel4Field,
	"EditForm": renderLevel4Field
	},
	"Neighborhood": {
	"NewForm": renderLevel5Field,
	"EditForm": renderLevel5Field
	}
	};
	SPClientTemplates.TemplateManager.RegisterTemplateOverrides(cascadingFieldContext);
	//Always start by populating the top drop-down in the cascading hierarchy
	function renderLevel1Field(ctx) {
	var formCtx = SPClientTemplates.Utility.GetFormContextForCurrentField(ctx);
	var fieldInternalName = ctx.CurrentFieldSchema.Name;
	var controlId = "ddl"+Level1InternalName;
	ctx.FormContext.registerInitCallback(fieldInternalName, function () {
	$addHandler($get(controlId), "change", function(e) {
	ctx.FormContext.updateControlValue(fieldInternalName, $("#"+controlId).val());
	$("#ddl"+Level2InternalName).trigger("clear");
	getDDLChoices(populateLevel2Choices);
	});
	getDDLChoices(populateLevel1Choices);
	});
	var validators = new SPClientForms.ClientValidation.ValidatorSet();
	validators.RegisterValidator(new SPClientForms.ClientValidation.RequiredValidator());
	formCtx.registerValidationErrorCallback(formCtx.fieldName,
	function (errorResult) {
	SPFormControl_AppendValidationErrorMessage(controlId+"Validator", errorResult);
	}
	);
	formCtx.registerClientValidator(formCtx.fieldName, validators);
	// Register a callback just before submit.
	formCtx.registerGetValueCallback(formCtx.fieldName, function () {
	return $("#"+controlId).val();
	});
	if(formCtx.fieldValue != ""){
	return '<select name="'+Level1InternalName+'" id="'+controlId+'"><option value="'+ formCtx.fieldValue +'" Selected>'+ formCtx.fieldValue +'</option></select><div id="'+controlId+'Validator"></div>';
	}else
	return '<select name="'+Level1InternalName+'" id="'+controlId+'"><option value=""></option></select><div id="'+controlId+'Validator"></div>';
	}
	function renderLevel2Field(ctx) {
	var formCtx = SPClientTemplates.Utility.GetFormContextForCurrentField(ctx);
	var fieldInternalName = ctx.CurrentFieldSchema.Name;
	var controlId = "ddl"+Level2InternalName;
	ctx.FormContext.registerInitCallback(fieldInternalName, function () {
	$addHandler($get(controlId), "change", function(e) {
	ctx.FormContext.updateControlValue(fieldInternalName, $("#"+controlId).val());
	$("#ddl"+Level3InternalName).trigger("clear");
	getDDLChoices(populateLevel3Choices);
	});
	$("#"+controlId).on("clear", function(e) {
	$("#ddl"+Level3InternalName).trigger("clear");
	$("#"+controlId).empty();
	$("#"+controlId).prop("disabled", true);
	$("#"+controlId).prepend("<option value='' disabled selected>"+noChoicesText+"</option>");
	$("#"+controlId).val('');
	});
	getDDLChoices(populateLevel2Choices);
	});
	var validators = new SPClientForms.ClientValidation.ValidatorSet();
	validators.RegisterValidator(new SPClientForms.ClientValidation.RequiredValidator());
	formCtx.registerValidationErrorCallback(formCtx.fieldName,
	function (errorResult) {
	SPFormControl_AppendValidationErrorMessage(controlId+"Validator", errorResult);
	}
	);
	formCtx.registerClientValidator(formCtx.fieldName, validators);
	// Register a callback just before submit.
	formCtx.registerGetValueCallback(formCtx.fieldName, function () {
	return $("#"+controlId).val();
	});
	if(formCtx.fieldValue != ""){
	return '<select name="'+Level2InternalName+'" id="'+controlId+'"><option value="'+ formCtx.fieldValue +'" Selected>'+ formCtx.fieldValue +'</option></select><div id="'+controlId+'Validator"></div>';
	}else
	return '<select name="'+Level2InternalName+'" id="'+controlId+'"><option value=""></option></select><div id="'+controlId+'Validator"></div>';
	}
	function renderLevel3Field(ctx) {
	var formCtx = SPClientTemplates.Utility.GetFormContextForCurrentField(ctx);
	var fieldInternalName = ctx.CurrentFieldSchema.Name;
	var controlId = "ddl"+Level3InternalName;//fieldInternalName + "_control";
	ctx.FormContext.registerInitCallback(fieldInternalName, function () {
	$addHandler($get(controlId), "change", function(e) {
	ctx.FormContext.updateControlValue(fieldInternalName, $("#"+controlId).val());
	$("#ddl"+Level4InternalName).trigger("clear");
	getDDLChoices(populateLevel4Choices);
	});
	$("#"+controlId).on("clear", function(e) {
	$("#ddl"+Level4InternalName).trigger("clear");
	$("#"+controlId).empty();
	$("#"+controlId).prop( "disabled", true);
	$("#"+controlId).prepend("<option value='' disabled selected>"+noChoicesText+"</option>");
	$("#"+controlId).val('');
	});
	getDDLChoices(populateLevel3Choices);
	});
	var validators = new SPClientForms.ClientValidation.ValidatorSet();
	validators.RegisterValidator(new SPClientForms.ClientValidation.RequiredValidator());
	formCtx.registerValidationErrorCallback(formCtx.fieldName,
	function (errorResult) {
	SPFormControl_AppendValidationErrorMessage(controlId+"Validator", errorResult);
	}
	);
	formCtx.registerClientValidator(formCtx.fieldName, validators);
	// Register a callback just before submit.
	formCtx.registerGetValueCallback(formCtx.fieldName, function () {
	return $("#"+controlId).val();
	});
	if(formCtx.fieldValue != ""){
	return '<select name="'+Level3InternalName+'" id="'+controlId+'"><option value="'+ formCtx.fieldValue +'" Selected>'+ formCtx.fieldValue +'</option></select><div id="'+controlId+'Validator"></div>';
	}else
	return '<select name="'+Level3InternalName+'" id="'+controlId+'"><option value=""></option></select><div id="'+controlId+'Validator"></div>';
	}
	function renderLevel4Field(ctx) {
	var formCtx = SPClientTemplates.Utility.GetFormContextForCurrentField(ctx);
	var fieldInternalName = ctx.CurrentFieldSchema.Name;
	var controlId = "ddl"+Level4InternalName;//fieldInternalName + "_control";
	ctx.FormContext.registerInitCallback(fieldInternalName, function () {
	$addHandler($get(controlId), "change", function(e) {
	ctx.FormContext.updateControlValue(fieldInternalName, $("#"+controlId).val());
	$("#ddl"+Level5InternalName).trigger("clear");
	getDDLChoices(populateLevel5Choices);
	});
	$("#"+controlId).on("clear", function(e) {
	$("#ddl"+Level5InternalName).trigger("clear");
	$("#"+controlId).empty();
	$("#"+controlId).prop( "disabled", true);
	$("#"+controlId).prepend("<option value='' disabled selected>"+noChoicesText+"</option>");
	$("#"+controlId).val('');
	});
	getDDLChoices(populateLevel4Choices);
	});
	var validators = new SPClientForms.ClientValidation.ValidatorSet();
	validators.RegisterValidator(new SPClientForms.ClientValidation.RequiredValidator());
	formCtx.registerValidationErrorCallback(formCtx.fieldName,
	function (errorResult) {
	SPFormControl_AppendValidationErrorMessage(controlId+"Validator", errorResult);
	}
	);
	formCtx.registerClientValidator(formCtx.fieldName, validators);
	// Register a callback just before submit.
	formCtx.registerGetValueCallback(formCtx.fieldName, function () {
	return $("#"+controlId).val();
	});
	if(formCtx.fieldValue != ""){
	return '<select name="'+Level4InternalName+'" id="'+controlId+'"><option value="'+ formCtx.fieldValue +'" Selected>'+ formCtx.fieldValue +'</option></select><div id="'+controlId+'Validator"></div>';
	}else
	return '<select name="'+Level4InternalName+'" id="'+controlId+'"><option value=""></option></select><div id="'+controlId+'Validator"></div>';
	}
	function renderLevel5Field(ctx) {
	var formCtx = SPClientTemplates.Utility.GetFormContextForCurrentField(ctx);
	var fieldInternalName = ctx.CurrentFieldSchema.Name;
	var controlId = "ddl"+Level5InternalName;
	ctx.FormContext.registerInitCallback(fieldInternalName, function () {
	$addHandler($get(controlId), "change", function(e) {
	ctx.FormContext.updateControlValue(fieldInternalName, $("#"+controlId).val());
	});
	$("#"+controlId).on("clear", function(e) {
	$("#"+controlId).empty();
	$("#"+controlId).prop("disabled", true);
	$("#"+controlId).prepend("<option value='' disabled selected>"+noChoicesText+"</option>");
	$("#"+controlId).val('');
	});
	getDDLChoices(populateLevel5Choices);
	});
	var validators = new SPClientForms.ClientValidation.ValidatorSet();
	validators.RegisterValidator(new SPClientForms.ClientValidation.RequiredValidator());
	formCtx.registerValidationErrorCallback(formCtx.fieldName,
	function (errorResult) {
	SPFormControl_AppendValidationErrorMessage(controlId+"Validator", errorResult);
	}
	);
	formCtx.registerClientValidator(formCtx.fieldName, validators);
	// Register a callback just before submit.
	formCtx.registerGetValueCallback(formCtx.fieldName, function () {
	return $("#"+controlId).val();
	});
	if(formCtx.fieldValue != ""){
	return '<select name="'+Level5InternalName+'" id="'+controlId+'"><option value="'+ formCtx.fieldValue +'" Selected>'+ formCtx.fieldValue +'</option></select><div id="'+controlId+'Validator"></div>';
	}else
	return '<select name="'+Level5InternalName+'" id="'+controlId+'"><option value=""></option></select><div id="'+controlId+'Validator"></div>';
	}
	function getDDLChoices(populateFunction){
	var field="";
	var modifiedRestUrl = restUrl;
	switch(populateFunction)
	{
	case populateLevel1Choices:
	console.log("Level 1 Choices");
	modifiedRestUrl += "?$select="+Level1Source+"&$orderby="+Level1Source+" asc&$top="+maxSourceItems;
	field=Level1Source;
	break;
	case populateLevel2Choices:
	console.log("Level 2 Choices");
	modifiedRestUrl += "?$select="+Level2Source+"&$filter="+Level1Source+" eq '"+$("#ddl"+Level1InternalName).val()+"'&distinct=true&$orderby="+Level2Source+" asc&$top="+maxSourceItems;
	field=Level2Source;
	break;
	case populateLevel3Choices:
	if(Level3InternalName == "" || Level3Source == "") {return {};}
	console.log("Level 3 Choices");
	modifiedRestUrl += "?$select="+Level3Source+"&$filter="+Level1Source+" eq '"+$("#ddl"+Level1InternalName).val()+"' and "+Level2Source+" eq '"+$("#ddl"+Level2InternalName).val()+"'&$orderby="+Level3Source+" asc&$top="+maxSourceItems;
	field=Level3Source;
	break;
	case populateLevel4Choices:
	if(Level4InternalName == "" || Level4Source == "") {return {};}
	console.log("Level 4 Choices");
	modifiedRestUrl += "?$select="+Level4Source+"&$filter="+Level1Source+" eq '"+$("#ddl"+Level1InternalName).val()+"' and "+Level2Source+" eq '"+$("#ddl"+Level2InternalName).val()+"' and "+Level3Source+" eq '"+$("#ddl"+Level3InternalName).val()+"'&$orderby="+Level4Source+" asc&$top="+maxSourceItems;
	field=Level4Source;
	break;
	case populateLevel5Choices:
	if(Level5InternalName == "" || Level5Source == "") {return {};}
	console.log("Level 5 Choices");
	modifiedRestUrl += "?$select="+Level5Source+"&$filter="+Level1Source+" eq '"+$("#ddl"+Level1InternalName).val()+"' and "+Level2Source+" eq '"+$("#ddl"+Level2InternalName).val()+"' and "+Level3Source+" eq '"+$("#ddl"+Level3InternalName).val()+"' and "+Level4Source+" eq '"+$("#ddl"+Level4InternalName).val()+"'&$orderby="+Level5Source+" asc&$top="+maxSourceItems;
	field=Level5Source;
	break;
	default:
	modifiedRestUrl=modifiedRestUrl;
	}
	console.log(modifiedRestUrl);
	return $.ajax({
	url: modifiedRestUrl,
	type: "GET",
	headers: {
	"accept": "application/json;odata=verbose"
	},
	success: function(result){
	if (result && result.d && result.d.results) {
	var resultDeduped = [];
	$.each(result.d.results, function(index, item) {
	//removes duplicates and null/empty items
	if (($.inArray(item[field], resultDeduped)==-1) && (item[field] !== null)) {
	resultDeduped.push(item[field]);
	}
	});
	populateFunction(resultDeduped);
	}
	},
	error: function(result){
	console.log("Error: " + modifiedRestUrl);
	console.log(result);
	}
	});
	}
	function populateLevel1Choices(result) {
	var currentVal = $("#ddl"+Level1InternalName).val();
	console.log("Current Level 1: " + currentVal);
	$("#ddl"+Level1InternalName).empty();
	for (var i = 0; i < result.length; i++)
	{
	console.log(result[i]);
	//Add this option to the select element and mark it selected if it matches the currentVal
	$("#ddl"+Level1InternalName).append("<option value='" + result[i] + ((result[i]==currentVal) ? "' Selected":"'") +">" + result[i] + "</option");
	}
	if(currentVal == $("#ddl"+Level1InternalName).val())
	{
	getDDLChoices(populateLevel2Choices);
	}else
	{
	//Adds empty option to current field when item doesn't already have value
	$("#ddl"+Level1InternalName).prepend("<option Selected='Selected' value=''></option");
	$("#ddl"+Level1InternalName).val('');
	}
	}
	function populateLevel2Choices(result) {
	var currentVal = $("#ddl"+Level2InternalName).val();
	console.log("Current Level 2: " + currentVal);
	$("#ddl"+Level2InternalName).empty();
	$("#ddl"+Level2InternalName).prop( "disabled", false);
	if(result.length > 0){
	for (var i = 0; i < result.length; i++)
	{
	console.log(result[i]);
	$("#ddl"+Level2InternalName).append("<option value='" + result[i] + ((result[i]==currentVal) ? "' Selected":"'") +">" + result[i] + "</option");
	}
	if(currentVal == $("#ddl"+Level2InternalName).val())
	{
	getDDLChoices(populateLevel3Choices);
	}else
	{
	//Adds empty but descriptive option to current field
	$("#ddl"+Level2InternalName).prepend("<option Selected='Selected' value=''></option");
	$("#ddl"+Level2InternalName).val('');
	}
	}else
	{
	$("#ddl"+Level2InternalName).append("<option value='' disabled selected>"+noChoicesText+"</option>");
	$("#ddl"+Level2InternalName).prop("disabled", true);
	}
	}
	function populateLevel3Choices(result) {
	var currentVal = $("#ddl"+Level3InternalName).val();
	console.log("Current Level 3: " + currentVal);
	$("#ddl"+Level3InternalName).empty();
	$("#ddl"+Level3InternalName).prop( "disabled", false);
	if(result.length > 0){
	for (var i = 0; i < result.length; i++)
	{
	console.log(result[i]);
	$("#ddl"+Level3InternalName).append("<option value='" + result[i] + ((result[i]==currentVal) ? "' Selected":"'") +">" + result[i] + "</option");
	}
	if(currentVal == $("#ddl"+Level3InternalName).val())
	{
	getDDLChoices(populateLevel4Choices);
	}else
	{
	//Adds empty but descriptive option to current field
	$("#ddl"+Level3InternalName).prepend("<option Selected='Selected' value=''></option");
	$("#ddl"+Level3InternalName).val('');
	}
	}else
	{
	$("#ddl"+Level3InternalName).append("<option value='' disabled selected>"+noChoicesText+"</option>");
	$("#ddl"+Level3InternalName).prop("disabled", true);
	}
	}
	function populateLevel4Choices(result) {
	var currentVal = $("#ddl"+Level4InternalName).val();
	console.log("Current Level 4: " + currentVal);
	$("#ddl"+Level4InternalName).empty();
	$("#ddl"+Level4InternalName).prop("disabled", false);
	if(result.length > 0){
	for (var i = 0; i < result.length; i++)
	{
	console.log(result[i]);
	$("#ddl"+Level4InternalName).append("<option value='" + result[i] + ((result[i]==currentVal) ? "' Selected":"'") +">" + result[i] + "</option");
	}
	if(currentVal == $("#ddl"+Level4InternalName).val())
	{
	getDDLChoices(populateLevel5Choices);
	}else
	{
	//Adds empty but descriptive option to current field
	$("#ddl"+Level4InternalName).prepend("<option Selected='Selected' value=''></option");
	$("#ddl"+Level4InternalName).val('');
	}
	}else
	{
	$("#ddl"+Level4InternalName).append("<option value='' disabled selected>"+noChoicesText+"</option>");
	$("#ddl"+Level4InternalName).prop("disabled", true);
	}
	}
	function populateLevel5Choices(result) {
	var currentVal = $("#ddl"+Level5InternalName).val();
	console.log("Current Level 5: " + currentVal);
	$("#ddl"+Level5InternalName).empty();
	$("#ddl"+Level5InternalName).prop("disabled", false);
	if(result.length > 0){
	for (var i = 0; i < result.length; i++)
	{
	console.log(result[i]);
	$("#ddl"+Level5InternalName).append("<option value='" + result[i] + ((result[i]==currentVal) ? "' Selected":"'") +">" + result[i] + "</option");
	}
	if(currentVal == $("#ddl"+Level5InternalName).val())
	{
	}else
	{
	//Adds empty but descriptive option to current field
	$("#ddl"+Level5InternalName).prepend("<option Selected='Selected' value=''></option");
	$("#ddl"+Level5InternalName).val('');
	}
	}else
	{
	$("#ddl"+Level5InternalName).append("<option value='' disabled selected>"+noChoicesText+"</option>");
	$("#ddl"+Level5InternalName).prop("disabled", true);
	}
	}
	})();

view raw CascadingDropDowns.js hosted with ❤ by GitHub