Skip to main content
K
KomputerMan_com-L7dcfe
Inspiring
July 20, 2016
Question

CFSELECT and Helper Text

  • July 20, 2016
  • 2 replies
  • 633 views

Ugh... brain fart time...
Awhile back I made a dropdown list using either <CFSELECT...> or maybe it was just a <SELECT...> control.  That isn't important tho...

What is important is I put in some text into the drop down list that said something like "Select an Item".  As soon as the user clicked on the control the instructional text "Select an Item" disappeared and was replaced with the contents of the dropdown list.

Problem is I can't remember how to add that "helper" type of text to the dropdown control.

I've added this OPTION tag below the CFSELECT but the helper text is now included as part of the selectable drop down items and I don't want that.

<CFSELECT NAME="ContactType" REQUIRED="Yes" QUERY="ConQry" DISPLAY="ConName" VALUE="ConType" TABINDEX="1" SELECTED="#MyContactType#"  SIZE="1" QUERYPOSITION="below" style="font-size:11px;background-color:##FFFFCC;" MESSAGE="Please select the method of contacting PERSI">
     <OPTION VALUE="0"> ---   Select a Method of Contact   --- </OPTION>
</CFSELECT>

Any thoughts???

    This topic has been closed for replies.

    2 replies

    K
    KomputerMan_com-L7dcfeAuthor
    Inspiring
    July 20, 2016

    Thanks WS, that's kind of what I decided to do.  If a 0 is passed I return a message saying select something else, hopefully they will never select it but ya gotta put in error trapping!!!

    Thing is I remember seeing this ghost like helper text inside a drop down list before.  Maybe it was on top and just got hid when clicked on...  I just wish I would have taken notes that day because I thought it was pretty cool...

    I also thought at the time I was making a career change and was getting out of the app dev biz and into the manufacturing biz with my startup.  After all 20 years doing any one thing is way long enough!  Problem is I ran out of money so it's back to being a butt in a chair slinging code!!!  :O

    BKBK
    Community Expert
    BKBKCommunity Expert
    Community Expert
    July 21, 2016

    A butt in a chair slinging code!

    Be thankful, my friend, there are worse things that butts sling.

      S
      Steve Sommers
      Legend
      July 25, 2016

      If you use the native form and select yourself with jquery.validation (which I HIGHLY recommend) instead of CFFORM/CFSELECT, then you can have an option value="" which the required check treats as non selected and displays a proper message to the user. Disabled options are valid as well but I'm not certain all browsers honor the setting but both work together nicely.

      WolfShade
      WolfShade
      Legend
      July 20, 2016

      Whether you use CFSELECT (I would highly recommend NOT using CFSELECT or CFFORM) or just a standard SELECT, if you set the first option to <option value="0"> SELECT SOMETHING </option>, then it is added to the list of options and is the first to be seen (unless you add "selected" to one of the options, in which case THAT will be the first seen.)

      AFAIK, there is no way around this.  It's either part of the options, or it's not.  And if it is, it isn't the end of the world.  Even if the SELECT is required and has to have a selectedIndex greater than 0, it should be available for a user to "unselect" a selection (IMHO).

      HTH,

      ^_^

      UPDATE:  And I really hate to add this, but.. (I haven't tested it) what about adding the "disabled" attribute to the option?  That way, it _should_ be the first seen, and if the user selects something, then they can't go back to SELECT SOMETHING, as it will be disabled.  PROBABLY not cross-browser, though.  Just a thot.

      Terms & ConditionsAccessibility statement
      Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices