4 Replies Latest reply on Jul 25, 2016 11:50 AM by Steve Sommers

    CFSELECT and Helper Text

    KomputerMan.com Level 1

      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>


      Any thoughts???

        • 1. Re: CFSELECT and Helper Text
          WolfShade Level 4

          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).






          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.

          • 2. Re: CFSELECT and Helper Text
            KomputerMan.com Level 1

            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

            • 3. Re: CFSELECT and Helper Text
              BKBK Adobe Community Professional & MVP

              A butt in a chair slinging code!

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

              • 4. Re: CFSELECT and Helper Text
                Steve Sommers Level 4

                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.