SitePoint Sponsor

User Tag List

Results 1 to 20 of 20
  1. #1
    SitePoint Enthusiast
    Join Date
    Sep 2000
    Location
    Australia
    Posts
    93
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Searching a dropdown menu

    I'm not sure how easy it would be to do, but I want a form that is able to take you to the closest value (alphabetically) in a dropdown menu based on the text being typed into a text box above it...

    Same sorta thing as you see in a lot of those help files on computers.

    It's something I've never really thought to try and implement before but it would be very useful for a particular page I am trying to create for my site at the moment.

    Preferably it would update as the user types (i.e. using the onKeyUp event)...

    Hope someone more intelligent than me has a few ideas

    Thanks,
    Matt

  2. #2
    morphine for a wooden leg randem's Avatar
    Join Date
    Jun 2002
    Location
    .chicago.il.us
    Posts
    957
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    assuming that the combobox is alphabetically sorted, this function will work on keyup:

    Code:
    function autopop(textbox,combobox){
      for(i=0; i<combobox.options.length; i++){
        if(combobox.options[i].value.substring(0, textbox.value.length)==textbox.value){
          combobox.selectedIndex = i; return;
      } }
    }

  3. #3
    The doctor is in... silver trophy MarcusJT's Avatar
    Join Date
    Jan 2002
    Location
    London
    Posts
    3,509
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Try these scripts (they are a little more sophisticated, and implement slightly different features):
    http://www.faqts.com/knowledge_base/view.phtml/aid/1174
    http://msdn.microsoft.com/code/defau...mpositedoc.xml
    MarcusJT
    - former ASP web developer / former SPF "ASP Guru"
    - *very* old blog with some useful ASP code

    - Please think, Google, and search these forums before posting!

  4. #4
    SitePoint Enthusiast
    Join Date
    Sep 2000
    Location
    Australia
    Posts
    93
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Marco and randem... thanks

    Unfortunately I want a combination of the two

    I need it to use the textbox as with http://www.faqts.com/knowledge_base/view.phtml/aid/1174

    But I also want it to select the nearest in the list if there is no exact match as with http://msdn.microsoft.com/code/defa...ompositedoc.xml

    Unfortunately, the DHTML code in the microsoft one is largely over my head (I haven't ever worked with DHTML and my last work with Javascript was several years ago) for me to be able to adapt the two...

    If anyone has seen one with both these features or would be able to help in combining the two to use the textbox and match the closest, it would be greatly appreciated

    Matt

  5. #5
    The doctor is in... silver trophy MarcusJT's Avatar
    Join Date
    Jan 2002
    Location
    London
    Posts
    3,509
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You'll have to be a little more specific - if (when using the first link's code) I entered "Kibolagy" [sic], what would you want the textbox to show?

    Do you want it to prevent users entering something that is not on the list?

    Or should it stick at the item which last matched the entered text (before it stopped matching)?

    Or something else?
    Last edited by M@rco; Jul 7, 2002 at 06:21.
    MarcusJT
    - former ASP web developer / former SPF "ASP Guru"
    - *very* old blog with some useful ASP code

    - Please think, Google, and search these forums before posting!

  6. #6
    SitePoint Enthusiast
    Join Date
    Sep 2000
    Location
    Australia
    Posts
    93
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    If there isn't an exact match, I would want it to find the two options that it is between alphabetically (and highlight either one of those - this isn't really that important. I think the microsoft version highlights the latter).

    The microsoft one is what I want...
    eg. If I enter Catherine, it highlights Catherine...
    If I enter Cather it highlights Catherine
    If I enter Cbob then it is alphabetically between Catherine and Chuck so it highlights Chuck etc.

    i.e. Finds the closest match to what is entered.

    I would simply use the microsoft one, except that I want it entered into a text box and based on everything in the textbox (like the first option) rather than typed into the options list and timing out etc.

    I tried altering the code accordingly but too much of that is over my head for me to know what needs to be changed/left etc.
    Matt

  7. #7
    The doctor is in... silver trophy MarcusJT's Avatar
    Join Date
    Jan 2002
    Location
    London
    Posts
    3,509
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ok - going to bed now (04:43) but will cobble it together in the morning (which will probably be closer to midday in reality)!!

    ZZZZZZZZzzzzzzzzzz..........
    MarcusJT
    - former ASP web developer / former SPF "ASP Guru"
    - *very* old blog with some useful ASP code

    - Please think, Google, and search these forums before posting!

  8. #8
    The doctor is in... silver trophy MarcusJT's Avatar
    Join Date
    Jan 2002
    Location
    London
    Posts
    3,509
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Right! Am awake now, and both brain cells are functioning!!

    From the description of your requirements, I thought the first example fitted your needs better? I have modified it to be case insensitive, but otherwise it meets your requirements, so long as you realise that it is the selected item in the listbox that is the important value (and should be processed once the form is submitted), not the value of the text field.

    If this is not what you want, then I can only think that you want me to restrict the text field so that it can never contain any value which is not present in the SELECT box. Is this correct?

    Anyway, see the current (modified) version here:
    http://www.marcustucker.com/temp/autocomplete.htm
    Last edited by M@rco; Jul 8, 2002 at 05:34.
    MarcusJT
    - former ASP web developer / former SPF "ASP Guru"
    - *very* old blog with some useful ASP code

    - Please think, Google, and search these forums before posting!

  9. #9
    SitePoint Enthusiast
    Join Date
    Sep 2000
    Location
    Australia
    Posts
    93
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks for your help...

    What I was intending isn't quite that but it is close

    If more option were added to the list, i.e.

    Code:
    		<option>Bananas
    		<option>Kibo
    		<option>Kibologist
    		<option>Kibology
    		<option>Kibology for all
    		<option>Leeches
    		<option>Rhubarb
    and the user enters the text 'Grape', it would highlight either Bananas or Kibo as being the closest alphabetically. Likewise, if they entered 'Potato', it would highlight Leeches or Rhubarb as the closest.
    If they entered 'Zebra' then it would highlight the last option (Rhubarb) as being closest alphabetically.

    This is the part of the microsoft one that I was after

    Having it maintain the highlight option and being case insensitive certainly improves that first one, thanks for your help

    If you don't have the time/patience to alter it then I'll use what you have done so far with a lot of gratitude

    Thanks,
    Matt

  10. #10
    The doctor is in... silver trophy MarcusJT's Avatar
    Join Date
    Jan 2002
    Location
    London
    Posts
    3,509
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Well, if it's alright with you, there's a million and one other things I really should be doing!

    As long I've got you closer to your goal, then I'm sure you can polish the rest off, right? After all, you wouldn't want me to do it all for you, now would you?!!!
    MarcusJT
    - former ASP web developer / former SPF "ASP Guru"
    - *very* old blog with some useful ASP code

    - Please think, Google, and search these forums before posting!

  11. #11
    Perl/Mason Guru Flawless_koder's Avatar
    Join Date
    Feb 2002
    Location
    Gatwick, UK
    Posts
    1,206
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    .oO( * I * sure as hell wouldn't want him doing it all for me )

    Flawless
    ---=| If you're going to buy a pet - get a Shetland Giraffe |=---

  12. #12
    The doctor is in... silver trophy MarcusJT's Avatar
    Join Date
    Jan 2002
    Location
    London
    Posts
    3,509
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ooh! Handbags! Shall we take this outside, Flawless?
    MarcusJT
    - former ASP web developer / former SPF "ASP Guru"
    - *very* old blog with some useful ASP code

    - Please think, Google, and search these forums before posting!

  13. #13
    SitePoint Wizard Goof's Avatar
    Join Date
    Feb 2001
    Location
    Pittsburgh, PA
    Posts
    1,154
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I'm not sure that the expression "Ooh! Handbags!" strikes fear into the hearts of your enemies. Might I suggest you look for something else?


    Goof
    Nathan Rutman
    A slightly offbeat creative.

  14. #14
    The doctor is in... silver trophy MarcusJT's Avatar
    Join Date
    Jan 2002
    Location
    London
    Posts
    3,509
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    AFAIK, Flawless isn't an enemy...!
    (Flawless?? )
    MarcusJT
    - former ASP web developer / former SPF "ASP Guru"
    - *very* old blog with some useful ASP code

    - Please think, Google, and search these forums before posting!

  15. #15
    SitePoint Enthusiast
    Join Date
    Sep 2000
    Location
    Australia
    Posts
    93
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Yeah no problem

    Thanks for all your help!

    Matt

  16. #16
    Perl/Mason Guru Flawless_koder's Avatar
    Join Date
    Feb 2002
    Location
    Gatwick, UK
    Posts
    1,206
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    lol @ Marco.
    Sorry - been busy trying to upgrade an application from version 1.04 of Mason to version 1.11 with an Incompatibility list so long you could put it next to the Magna Carter and people'd wonder which was longer!

    Anywayz...

    Flawless
    ---=| If you're going to buy a pet - get a Shetland Giraffe |=---

  17. #17
    The doctor is in... silver trophy MarcusJT's Avatar
    Join Date
    Jan 2002
    Location
    London
    Posts
    3,509
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Can't.......resist........!

    "Magna Carter" --> "Magna Carta"
    (profuse apologies "Flawless"! )
    MarcusJT
    - former ASP web developer / former SPF "ASP Guru"
    - *very* old blog with some useful ASP code

    - Please think, Google, and search these forums before posting!

  18. #18
    SitePoint Wizard Goof's Avatar
    Join Date
    Feb 2001
    Location
    Pittsburgh, PA
    Posts
    1,154
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Maybe he meant the Magna Charter...although I don't know what that is.

    Goof
    Nathan Rutman
    A slightly offbeat creative.

  19. #19
    Perl/Mason Guru Flawless_koder's Avatar
    Join Date
    Feb 2002
    Location
    Gatwick, UK
    Posts
    1,206
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Oh MY @ Marco - now THAT'S the best correction I've seen in a while!

    Most corrections are something i would have done myself - but i'd completely forgotten that one!

    I had someone trying to tell me i meant deprecated and not depreciated on another mailing list...
    But it's ok - it all made sense when i found out he was american

    I take it the office's going slow at your end too then

    Don't you just HATE Fridays?

    Flawless
    ---=| If you're going to buy a pet - get a Shetland Giraffe |=---

  20. #20
    The doctor is in... silver trophy MarcusJT's Avatar
    Join Date
    Jan 2002
    Location
    London
    Posts
    3,509
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Indeed, Flawless!!

    mtffafl, have you now modified it to fit your needs? If so, can I see it?!
    MarcusJT
    - former ASP web developer / former SPF "ASP Guru"
    - *very* old blog with some useful ASP code

    - Please think, Google, and search these forums before posting!


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •