3.2.0

multiple selection dropdown?

How can I create multiple selection dropdown? For example
see this URL http://www.codeproject.com/asp/multiselectdropdown.asp

Thanks
msajedi
May 11,
Alex,
Would you please comment on this question?

Thanks
msajedi
May 14,
You can allow multiple selection in combo popup using selection mode property and also disable closing popup on click -

<style>

#myCombo-popup .aw-items-selected {background: #ccc}

</style>
<script>

    var combo = new AW.UI.Combo;
    combo.setId("myCombo");

    combo.setItemText(function(i){return "item" + i});
    combo.setItemCount(30);

    combo.setSelectionMode("multi");
    combo.onCurrentItemChanged = null;

    combo.onSelectedItemsChanged = function(items){
        var i, a = [];
        for (i=0; i<items.length; i++){
            a[i] = this.getItemText(items[i]);
        }
        this.setControlText(a.join(", "));
    }

    document.write(combo);

</script>


On the first glance it works very similar to the one in your link.
Alex (ActiveWidgets)
May 14,
Thank you
msajedi
May 15,
Alex,
Would you please show me how to add the above combo to a grid?

Thanks
msajedi
May 24,
Alex,
Would you please also show me how to write a function for
combo.onCurrentItemChanged ?

Thanks again
msajedi
May 24,
Alex,

I tired very hard to find answer to above questions without success.
Would you please answer the above questions?

Thanks
msajedi
May 30,
Mohammad,

Sorry for the delay - there was a nasty bug in template focus code, which I could not find for a while. Here is the example code, basically you should use normal combo template and modify a List control, which is used as a popup -

var list = new AW.UI.List;

list.setItemText(function(i){return "item" + i});
list.setItemCount(30);

list.setSelectionMode("multi");

list.onControlActivating = function(){
    this.lock();
}

list.onSelectedItemsChanged = function(items){
    try {
        var i, a = [];
        for (i=0; i<items.length; i++){
            a[i] = this.getItemText(items[i]);
        }

        var s = a.join(", ");
        this.$owner.setCellText(s, this.$0, this.$1);

        var e = this.$owner.getCellTemplate(this.$0, this.$1).getContent("box/text").element();
        if (AW.ie){
            e.innerHTML = s;
        }
        else {
            e.value = s;
        }
        e = null;
    }
    catch(err){
        // ignore errors
    }
}


var obj = new AW.UI.Grid;
obj.setCellData(function(col, row){return col + "." + row});
obj.setHeaderText("header");

obj.setColumnCount(10);
obj.setRowCount(10);
obj.setCellEditable(true);

obj.setCellTemplate(new AW.Templates.Combo, 1);

obj.onPopupTemplateChanged = function(){return true}; // cancel the default handler
obj.setPopupTemplate(list, 1);

document.write(obj);


Alex (ActiveWidgets)
May 30,
Alex,

I am trying to preselect some of the items of the dropdown menu for each
row. Each will have a different set of selections.

I added the following line of code to your above example. This obviously gives me the same set of the preselections for every row.

Would you please tell me how to make the preselection different for each row?

Thanks
MS

var list = new AW.UI.List;
   var array = [3, 5, 8];
   list.setSelectedItems(array);
msajedi
June 3,

This topic is archived.

See also:


Back to support forum