Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New to the CF scene
    Join Date
    Sep 2011
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Dynamic dropdown list for sending messages to multiple members

    I am developing a messaging service between members of my site. I am developing this with asp.net mvc. When a user goes to the SendMessage view to send a message to another member, there is a dropdown list which presents the sender with all the members of the site, which he or she will pick as the recipient. However, i don't want it to be a dropdown, i want it to be a text box, where a user types in the first couple of letters of a name, and the dropdown appears then with only the members which have the same couple of letters. This is basically like every email system out there (facebook and gmail have it just like that). And after they chose one, they can select another one in the same textbox, just separated by a comma or something like that.

    Basically, how do i achieve that in javascript? I'm not even sure what that functionality is called, that's why i had to explain it properly.

    Any help is greatly appreciated. thank you

  • #2
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    2,768
    Thanks
    55
    Thanked 518 Times in 515 Posts
    I think it's called an autocomplete, the thing you are looking for. jQuery has one that is somewhat simple to implement:
    http://docs.jquery.com/UI/Autocomplete

    although you will have to tweak it to accept multiple selections.

    the other thing is that you can modify a dropdown list to highlight multiple options by clicking the option while holding down ctrl
    Code:
    <select multiple="yes">
    <option>me</option>
    <option>you</option>
    <option>him</option>
    </select>

  • #3
    New to the CF scene
    Join Date
    Sep 2011
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by xelawho View Post
    I think it's called an autocomplete, the thing you are looking for. jQuery has one that is somewhat simple to implement:
    http://docs.jquery.com/UI/Autocomplete

    although you will have to tweak it to accept multiple selections.

    the other thing is that you can modify a dropdown list to highlight multiple options by clicking the option while holding down ctrl
    Code:
    <select multiple="yes">
    <option>me</option>
    <option>you</option>
    <option>him</option>
    </select>
    Thank you so much, that worked great. you wouldn't happen to know how to add your own list to that source? i have a list called MessageModel.MemberNameSelectList() but javascript and mvc are not communicating for me

  • #4
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    2,768
    Thanks
    55
    Thanked 518 Times in 515 Posts
    Quote Originally Posted by coffeejunkie View Post
    Thank you so much, that worked great. you wouldn't happen to know how to add your own list to that source? i have a list called MessageModel.MemberNameSelectList() but javascript and mvc are not communicating for me
    mmm... which approach are you using? if it is the jQuery one, the simple answer would be by plugging the array into the source: option. I don't really know anything about jQuery and know nothing about mvc - maybe that question would be better asked in the jQuery forum?

    if it is the select list approach you can dynamically add options to a select list doing something like this:

    Code:
    js:
    
    for (var k=0; k<dropdowns.length; k++) {
    var optn = document.createElement("OPTION");
    optn.text = dropdowns[k];
    document.myform.selectlist.options.add(optn);
    }
    
    html:
    <form name="myform"><select id="selectlist" multiple="yes"><option>select an option</option></select></form>
    where dropdowns is the name of the array where you have your names stored


  •  

    Tags for this Thread

    Posting Permissions

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