Forums Ignite UI for jQuery
Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
Close
Ben Hull
820
Dialog Edit with multiselect igCombo not selecting items
posted

Hello,
I am having issues trying to set the selected items in the multiSelection combo box.
I have an array propery bound to the 'Products' column in the grid.  when the edit dialog opens, the multiSelection combo box checks the item if there is only one in the array, but if there are many, no items are being selected.

How can i select all items from the bound array column when the edit dialog opens?

The example attached as two records that have multiple products assign and would like to see these items to be checked and selected in the multisection combobox.


igGrid_uploadControl.zip

Parents
No Data
Reply
  • 200
    Verified Answer
    Offline posted

    Hello Ben,

    I updated the sample you previously sent that supports multiple selection in igCombo.

    By design grid doesn’t allow saving complex values in the data source such as arrays. This means that custom implementation should be applied if multiple selection is needed.

    This can be done by creating a custom editor provider that extends the default EditorProviderCombo and overwrite its default getValue and setValue methods. Here is an example on how to set the custom provider:

    $.ig.ComboEditorProviderCustom = $.ig.EditorProviderCombo.extend({
     getValue: function () {            
     var val = this.editor.value();
     var text= this.editor.text();
     if ($.type(val) === "array" && val.length) {        
         //When the passed value is of complex type return the text instead. 
         //This will be the value saved in the grid data source after editing ends.
         return text;
     }                
     return val;
     },
     setValue: function (val, fire) {                    
         var array = [];
         this.editor.deselectAll();                    
         if (this.options.multiSelection.enabled && val.contains(this.options.multiSelection.itemSeparator)) {
             //if multiSelection is enabled and the value passed from the grid cell to the edito contains the specified itemSeparator
             //Then split the value by the separator and set a complex value back to the editor so that the matching items will get selected.
             array = val.split(this.options.multiSelection.itemSeparator);
             return this.editor.value(array, null, fire);
         }    
         this.editor.value(val, null, fire);
     }                
 });

    You can see more information about this here.

    Feel free to ask me any additional questions.

    igGrid_uploadControl_updated.zip

Children