Dynamically add Items to the MultiSelect with javascript

  1. #1

    Dynamically add Items to the MultiSelect with javascript

    I need to be able to dynamically add Items to the MultiSelect with javascript. I believe these items that I add will just need to be added to the store then the MultiSelect refreshed but I'm not sure how to do those steps in javascript with coolite. If it were just a typical listbox I would just have to do the following :
    var opt = document.createElement("option");
    opt.text = description;
    opt.value= name;
    document.getElementById(getListBox1ClientID()).options.add(opt);

    Can you show me how to do this (in javascript as above) with the coolite MultiSelect control please?


    Thanx,
  2. #2

    RE: Dynamically add Items to the MultiSelect with javascript

    I have figured out the answer!!!!!!

    Here's how, as I noticed there are many questions asking basically the same thing about client side adding to the MultiSelect.


    Info:
    My multiSelect holds ListItems 'text', 'value' pairs...
    I have created a reference to my MultiSelect on render (servir_ivFromBox)


    Steps to add to the MultiSelect are as follows:


    1) create a record object as such
    var MyRecord = Ext.data.Record.create([ // creates a subclass of Ext.data.Record
                                                                                {name: 'text', mapping: 'text'},
                                                                                {name: 'value', mapping: 'value'}
                                                                               ]);
    Notice this is just the template for a ListItem...
    2) Create an instance of the object you just made as such
    var myNewRecord = new MyRecord(
                        {
                              text: 'ListItem Text Goes Here',
                              value: '8'
                        });
    3) Add instance you created to the MultiSelects store as such
    servir_ivFromBox.store.add(myNewRecord);
    This does the trick, the list is updated and the new item follows the rules set for all items like dragable in my case...


    I also noticed some posts asking how to clear the list client side. The code below does that.
    servir_ivFromBox.store.removeAll();

    Thanx,


Similar Threads

  1. How to add items to a MultiSelect??
    By javito in forum 1.x Help
    Replies: 1
    Last Post: May 06, 2010, 5:57 PM
  2. MultiSelect - Dynamic Set Items?
    By Zhivko in forum 1.x Help
    Replies: 1
    Last Post: Apr 15, 2010, 8:11 PM
  3. [CLOSED] Dynamically add/remove items from multiselect.
    By Jurke in forum 1.x Legacy Premium Help
    Replies: 4
    Last Post: Nov 30, 2009, 11:12 AM
  4. [CLOSED] Selecting all items in a MultiSelect dynamically
    By Etisbew in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Aug 19, 2009, 7:14 AM
  5. Replies: 0
    Last Post: Jun 03, 2009, 5:30 PM

Posting Permissions