Obscure (And Not So Obscure) Bugs with Complex Dropdowns in SharePoint Forms

As I’ve written in the past, there are several types of “dropdowns” in SharePoint forms. Briefly, there are:

  • “Simple” dropdowns – These are plain, old HTML selects; the type of dropdown you are most familiar with on the Web. SharePoint renders one of these when there are fewer than 20 options.

  • “Complex” dropdowns – SharePoint gives you these if there are 20 or more options. The interesting thing about this type of dropdown is that it is actually pretty ingenious, but very few people know why. When I ask in my presentations at various events who knows about the ingenious part, the percentage of people in the room who know about why they are ingenious is almost always less than 50% and usually far below. I’ll tell you how it works at the end of the post.

  • Multi-select dropdowns – Sure, these aren’t truly dropdowns, but they are what SharePoint displays when you when you offer the user a set of choices and want to allow them to select zero or more of those choices and you don’t choose checkboxes – sort of a dropdown.

image

The naming convention above is mine, one that I came up with when I was trying to understand the Document Object Model (DOM) which SharePoint renders so that I could write some of the cool functions in SPServices. The issues I am going to point out in this post occur with the “complex dropdown” only.

Issue One – The Wrong Selection

When a Lookup column’s list source has duplicate values and a validation error occurs elsewhere in the form, the first matching value is shown as selected, not the value which was selected if the selection was occurrence 2+. That’s a little hard to follow, so here is what I mean.

We can demonstrate this on a list form with a dropdown (Lookup) column and one other column which has validation of any type. In my example, there’s one column for State and another for City. Assume that there are two or more States with the name Alabama. (This isn’t a great example, but bear with me, as it will prove the point.) Also assume that there are 20+ States and that the City column is required.

When we select the second Alabama value and no City is selected, on submit there is a validation error because a City is required.

image

That’s all well and good, and what we would like to have happen:

image

However, the first occurrence of Alabama is now selected rather than the second, which we had selected:

image

This may be a weak example, but it still proves that there is a bug introduced by the complex dropdown control. If the person setting up the list for States knows enough about relational data, they won’t have multiple items in the list with the same Title. However, many users (and frankly, many IT people) are not well-versed in the nuances of building a good information architecture which follows the rules of relational data constructs. It’s reasonable to expect that SharePoint will record the correct value.

The bug is introduced because rather than saving and matching on the selected option’s value (which is the ID for the item in the Lookup list), the text of the selected option is used to match, therefore causing the error. I’ve had to introduce the same bug into SPServices so that I can mimic the out of the box functionality.

This bug is identical in SharePoint 2007 and 2010.

Issue Two – User Interface Bug with No Dialogs

This issue occurs only in SharePoint 2010. By default, list forms in 2010 are displayed in a dialog box. What this means is that rather than going to an entirely new page to display the form as happens in SharePoint 2007, the form is “popped up” over the current page, which is usually a list view.

When the form is shown in the dialog box, all is well and good, and the complex dropdown looks like this when you try to choose an option:

image

However, if you decide to turn off the dialogs (List Settings / Advanced Settings / Dialogs – way down at the bottom of the screen), there is a display issue where the available values are shifted about 155px to the right:

image

The dropdown otherwise functions just fine, but it sure doesn’t look right.

In my opinion, and based on conversations with my clients, the constant dialogs are an anathema in SharePoint 2010. They certainly make forms which have any complexity to them harder to fill out. I usually recommend turning the option for dialogs off for many forms. Unfortunately, it’s a manual, repetitive process.

The complex dropdown is truly a complicated beast. It’s made up of multiple HTML elements and JavaScript which allows it to function. Unfortunately, that markup and scripts doesn’t seem to have gone through a perfect Quality Assurance (QA) process.

Oh, and the ingenious part of the complex dropdown I promised you? When you start typing in the input element – yes, you can type in there! – the control filters the available values it shows. For example, if I type “sou” into the input element, I only see the “South Dakota” and “South Carolina” values in the dropdown.

image

This is great functionality, but since so few people know about it, especially real users of SharePoint, it serves little purpose other than to confuse everyone!

Similar Posts

6 Comments

  1. I can confirm the first bug and it actually happens no matter what type of dropdown you have (simple or complex). Watching Fiddler, the form posts and then and failing validation, comes back and selects the first item it can find that matches the text in your list. For the second bug I can’t reproduce it.

    It’s an issue and it should be fixed. My advice is simple. Don’t include duplicate items in choice fields. Frankly I think it’s rather silly if you do and I would consider it a bad design. There needs to be a way from users to select items and they need to be unique or else users won’t know which one to pick.

    The bug should be fixed, but I consider this more a developer issue. Structure your choices to be unique.

    Good find!

    1. Bil:

      I totally agree that one shouldn’t create duplicate values, but since Lookup columns can point to lists which are actively managed it’s bound to happen, and probably more often than we would like. The fact that the match occurs on the text rather than the ID is just plain bad. It’s surprising to me that it hasn’t caused issues all over the place, frankly, though people may just not realize that it has. It’s a bit naive to call this a developer issue, as one can create this issue right in the UI. Real users (the important people) can cause the issue and probably do all the time.

      It’s possible that the second bug is more obvious on different screen sizes. It’s only cosmetic, so hardly a show stopper. I can reproduce it, but not consistently. It only occurs with comp[lex dropdowns, not simple ones. I almost always turn off the [damn] dialogs, so I probably see it more often than others.

      M.

  2. Hello Marc,
    I have a form with a look up drop down which pulls the value from another list. There are five look up drop downs all pulling the same look up data at various positions of the form as the user fills in by.
    The weird thing that happened soon after sharepoint online upgrade is, whenever the user clicks on the complex look up drop down, it drops down the items to select. User selects and as he proceeds further down the form to select another look up drop down, the drop down drops the items in the previous drop down position. however, if the user scrolls to top of the form and selects any value, the same is getting populated correctly in the input where it is supposed to. it is the items that is always drops down on the very first drop down click where the user clicked.
    Any sugesstions……….. please help. I haven’t touched or modified this form and it used to work fine.
    Note: The same form works very well from firefox browser though. probably the way it renders it is different. also the behaviour of the complex drop down as i could see in the ie is not seen in firefox, I mean those little images and the drop down allows you to type these are not present in firefox. but it works like a charm in dropping the items of drop down for each drop down list exactly the place where it is supposed to be.
    unfortunately i cannot tell the users not to use ie.

    please help.!

  3. Thanks for pointing out this PITA – I couldn’t get why my dropdown was suddenly not working right as I added more test data,,,

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.