Using SPFilterDropdown to Reorder Options in a Dropdown on a SharePoint Form

Many times when you have a dropdown column in your lists, you’d like to show the values sorted in a different order than alphabetically. Sure, you can use a Choice column and order the choices in any way you’d like. However, in the cases where you want the dopdown to be based on a Site Column which is a Lookup into a list, you can’t specify the sort order. I prefer using a Lookup column in almost all cases because it means that an admin (or any user with permission, really) can update the values in a list context rather than a column settings context. We also often end up storing other information about the values in the list, which we can’t do with a Choice column.

Here’s an example. I have a Site Column called Recommendation. It’s a pretty common idea: what’s our view on a particular stock or bond? We may want to recommend to our clients that the stock should be a Strong Buy, Buy, Hold, or Sell. If we add those values to a list as the source for a Lookup column, they will be ordered like this: [Buy, Hold, Sell, Strong Buy]. That’s not how we logically think of things, so it’s not great.

SPServices to the rescue! If we add a column to the source list which contains the sort order we want, we can make things look the way we need them to work. In my list below, I have a column called, logically enough, SortOrder. Note that it contains values which will sort the recommendation options the way we want.

Recommendations Datasheet View
Recommendations Datasheet View

Then, in the forms where I use the Recommendation column, I can add a call to the SPFilterDropdown function which takes care of things for me. No, the function name really doesn’t indicate that it could help with this – I built it to let you filter the options in a dropdown based on a column in the source list – but there’s a little trick you can use. If you specify a condition in your CAMLquery which always evaluates to true and specify a relationshipListSortColumn, the function will sort the values the way you want.

For my example above, I specify SortOrder as the relationshipListSortColumn, and set the CAMLQuery to give me all items where the Title does not equal an empty string. That will return all of the items, they will be sorted by SortOrder, and the dropdown will look just the way we want it to.

Recommendation Dropdown
Recommendation Dropdown
// If the Recommendation column exists, sort it as indicated in the source list
$().SPServices.SPFilterDropdown({
 relationshipWebURL: "/", // The source list for the Recommendation site Column is in the root site
 relationshipList: "Recommendations",
 relationshipListColumn: "Title",
 relationshipListSortColumn: "SortOrder",
 columnName: "Recommendation",
 CAMLQuery: "<Neq><FieldRef Name='Title' /><Value Type='Text'></Value></Neq>", // Get all values by specifying a non-blank Title
 debug: true // Debug mode on while we're developing
});

Similar Posts

27 Comments

  1. Hi Marc,

    I was try to filtering dropdown on child list using SPFilterDropdown. its not working. I use sharepoint 2013, jquery-1.11.3 and jquery.SPServices-2014.02. Below the script :

    $().SPServices.SPFilterDropdown({
    relationshipList: “Item Master Data”,
    relationshipListColumn: “Title”,
    columnName: “Metric”,
    CAMLQuery: “KPI Metric”,
    completefunc: null,
    debug: true
    });

    Field Master Type in list Item Master Data was lookup to another parent child, whether it was cause?

    Thx

  2. Hi,

    I’m having some trouble getting my dropdown lookup field to sort by my Orderby column,

    Here is my code:

    // If the Code column exists, sort it as indicated in the source list
    $().SPServices.SPFilterDropdown({
    relationshipWebURL: “/”, // The source list for the Code site Column is in the root site
    relationshipList: “Code”,
    relationshipListColumn: “Title”,
    relationshipListSortColumn: “Orderby”,
    columnName: “Code”,
    CAMLQuery: “”, // Get all values by specifying a non-blank Title
    debug: true // Debug mode on while we’re developing
    });

    Is there anything I didn’t do correctly?

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.