We can implement Cascading drop downs if we need to change the options or value of a column dynamically based on the selection from a Parent column. Below are code examples.
Cascading Drop Down Code for Lookup columns:
Provide your inputs in the below code.
Cascading Drop Down Code for Choice columns:
Note: This is using a slightly altered jquery.spservices library that I have attached. Also this example is for a two level cascading drop down code.
Cascading Drop Down Code for Lookup columns:
Provide your inputs in the below code.
<script src="/sites/…/jquery-1.4.2.min.js" type=text/javascript></script><script src="/sites/…/jquery.SPServices-0.5.2.min.js" type=text/javascript></script><script type="text/javascript">// Execute the following JavaScript after the page has fully loaded, when it's ".ready"$(document).ready(function(){ $().SPServices.SPCascadeDropdowns({ relationshipList: "Display Name of Master List", relationshipListParentColumn: "Parent Column Internal Name from Master List", relationshipListChildColumn: "Child Column Internal Name from Master List", relationshipListSortColumn: "Sorting Columns Internal Name from Master List", parentColumn: "Parent Column Display Name from List/Library", childColumn: "Child Column Display Name from List/Library" }); });</script> |
Cascading Drop Down Code for Choice columns:
Note: This is using a slightly altered jquery.spservices library that I have attached. Also this example is for a two level cascading drop down code.
<script src="/sites/…/jquery-1.3.2.js" type=text/javascript></script><script src="/sites/…/jquery.SPServices-0.5.2.min.js" type=text/javascript></script><script type="text/javascript">// Execute the following JavaScript after the page has fully loaded, when it's ".ready"$(document).ready(function(){ //Save existing values of Discipline Code and Document Type. The values are lost when cascading code runs. var VariableName1 = $("select[title='Display Name of Parent Column in List/Library']").val(); var VariableName2 = $("select[title='Display Name of Child Column in List/Library']").val(); // Cascade Dropdowns $().SPServices.SPCascadeDropdowns({ relationshipList: "Display Name of Master List 1", relationshipListParentColumn: "Internal Name of Parent Column in Master List 1", relationshipListChildColumn: "Internal Name of Parent Column in Master List 1", parentColumn: "Display Name of Parent Column in List/Library", childColumn: "Display Name of Child Column in List/Library" }); $().SPServices.SPCascadeDropdowns({ relationshipList: "Internal Name of Master List 2", relationshipListParentColumn: "Internal Name of Parent Column in Master List 2", relationshipListChildColumn: "Internal Name of Child Column in Master List 2", relationshipListSortColumn: "Internal Name of Sorting Column in Master List 2", parentColumn: "Display Name of Parent Column in List/Library", childColumn: "Display Name of Child Column in List/Library" }); // Reset the Discipline Code to its original value before cascading code ran $("select[title='Display Name of Parent Column in List/Lbrary']").val(VariableName1); // trigger the change event so the cascading code runs again $("select[title='Display Name of Parent Column in List/Library']").trigger('change'); // reset the Document Type to its original value $("select[title='Display Name of Child Column in List/Library']").val(VariableName2); });</script> |
No comments:
Post a Comment