We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
Unfortunately, activation email could not send to your email. Please try again.

Enable/disable dropdown remove selected values

Thread ID:

Created:

Updated:

Platform:

Replies:

128261 Jan 11,2017 07:24 AM Jan 24,2017 12:32 AM JavaScript 11
loading
Tags: ejDropDownList
Milos
Asked On January 11, 2017 07:24 AM

Hi,

I have a problem when I change value of 'enabled' attribute for ejDropDownList, all selected values are removed / disappeared.

Attached example partially reproduce example, but I think it would be helpful.
 
There are one multiple dropdown and one button. Click on the button change "enabled" value of dropdown.

Button click complete remove current data source and disable dropdown selection.
I do not know why enabling/disabling have influence on data source at all?

My real problem is that data source is not deleted, just selections are removed, but I could not reproduce it on this test example.

I hope so this would be a enough ...

regards,
Milos

Attachment: HTML_StarterKit_54dea7a4.zip

Karthikeyan Viswanathan [Syncfusion]
Replied On January 12, 2017 02:08 AM

Hi Milos,   
  
Thanks for contacting Syncfusion Support.   
  
We have analyzed your shared sample. We found the issue reproducing criteria of your sample. For the first execution ko.observableArray([]) empty array was assigned to dropdownlist, then updated DropDownDataSource called some array value to be set into dropdownlist. So, that it is working fine initially. On button click, ko.observableArray([]) empty array is set to dropdownlist. For an empty value, the dropdownlist displays nothing and datasource is not loaded. Please check this data source issue and set the data properly.   
  
     
<code>   
  
self.dropDownMultiple = {   
  
// Issue occurred in below highlighted case.   
            dataSource: ko.observableArray([ ]),   
            fields: { text: "text", value: "value" },    
            enabled: self.isReadonly,   
            allowMultiSelection: true,   
            multiSelectMode: "visualMode",   
        }   
  
</code>   
  
   
  
Regards,   
Karthikeyan V.   


Milos
Replied On January 12, 2017 10:12 AM

Hi Karthikeyan,

Thank you for your response.

In my project dropdownlist dataSource is updating all the time with promise requests.
It means my initial datasource does not help me to much since it will be changed many times.

In my new attachment below you can see how I put initial datasource with the same values but different labels.
First time you click on button "Change enabled DD", all selected values will be removed and current data source will be replaced with initial datasource, although selection values are the same. 

I do not know why enabling/disabling feature have influence on dataSource ?
I do not know how does it work in background but I assumed that should be some CSS update (when we enable/disable dropdown) not changing datasource or any other data manipulation. 

Regards,
Milos

Attachment: HTML_StarterKit_fb59fd61.zip

Karthikeyan Viswanathan [Syncfusion]
Replied On January 13, 2017 01:27 AM

Hi Milos, 
 
Thanks for your update. 
 
When button click, Model properties values changes will be reflected into dropdownlist. In your case, Model value changes passing with dataSource and enabled properties. The dataSource value is be changed when you assigned as ko.observableArray([]). For an empty value, the dropdownlist displays nothing and datasource is not loaded. 
 
Regards, 
Karthikeyan V. 


Milos
Replied On January 13, 2017 02:32 AM

Hi Karthikeyan,

Thank you for explanation.

Is there any way how I can solve my problem from last attachment, where I have initial data source and I constantly update datasource and enable / disable dropdown from time to time?

regards,
Milos

Gopi Govindasamy [Syncfusion]
Replied On January 16, 2017 07:55 AM

Hi Milos,  

We have checked your scenario for when click the button to disable the dropdownlist, clear the text and enable the dropdownlist and bind to another datasoure or Model value changes passing with dataSource. The dataSource value is be changed when you assigned as ko.observableArray([]). We have prepared sample and attached sample below link. 


Please let us know if you need any other help. 

Regards, 
Gopi G. 


Milos
Replied On January 17, 2017 07:00 AM

Hi Gopi,

Sorry for the inconvenience, it seems I attached wrong example in one of my previous answer.
Here is the right version now.

Point is that I lost all selection of my dropdown first time when I disabled it.
Enabling datasource also erase my updated datasource and back it to the initial state.


Regards,
Milos

Attachment: Syncfusion_1_a37af553.zip

Gopi Govindasamy [Syncfusion]
Replied On January 18, 2017 10:52 PM

Hi Milos,
  

We have checked your shared sample. Your shared sample button control used. When button click, Model properties values changes will be reflected into dropdownlist. In your case, Model value changes passing with dataSource and enabled properties. So we have use toggle button change event take dropdownlist object enable() and disable() method dropdownlist disabled, but input text clear. Please find the code snippet.
  

<code>  


  

 

self.check = {
    width: "107px", 
    defaultText: "Enable", 
    activeText: "Disable",
    change: function(args){ 
        var obj = $('#' + self.dropDownMultipleId).data("ejDropDownList");
        if(args.isChecked){
            obj.disable();
        } 
        else{
            obj.enable()
        } 
    } 
}
 


  

</code>  


  

Regards,  

Gopi G.  

Milos
Replied On January 20, 2017 10:51 AM

Hi Gopi,

Thanks for replay.

Actually dropdown does not remove selection values when we use jquery:

   var obj = $('#' + self.dropDownMultipleId).data("ejDropDownList");
            obj.disable();  or    obj.enable()


I solved my problem with your replay, thank you, but I thinks it is a bug.
Enabling/disabling feature does not have to do anything with selected values it should work also with ko.observable variable also.


Regards,
Milos

Karthikeyan Viswanathan [Syncfusion]
Replied On January 23, 2017 04:25 AM

Hi Milos, 
 
Thanks for your reply. 
 
Please find the details in following table: 
 
S.No 
Details 
1 
In your shared sample, You have assigned a JSON observable object values into KO Dropdownlist control. In button click, You have change the enable values and in previous you have changed the datasource values as empty array into JSON observable object. This observable object is override the initial rendered. So, The datasource model values changes also be reflected with enable property into dropdownlist. In your case, Model changes passing with dataSource and enabled properties. The dataSource value is be changed when you assigned as ko.observableArray([]). For an empty value, the dropdownlist displays nothing and datasource is not loaded. 
So, This is not an issue. It is a behavior of Knockout JS. Please refer to the Knockout JS Documentation link: http://knockoutjs.com/documentation/observables.html 
2 
In JavaScript , Public method call(enable() / disable()) is not be changed the JSON observable object values. So, Dropdownlist datasource values is not be changed. This is the different between this two scenario. 
 
Please let us know if you need any other help. 
 
Regards, 
Karthikeyan V. 


Milos
Replied On January 23, 2017 07:03 AM

Hi Karthikeyan ,

Thanks for explanation, now it is clear.
No more questions from my side :).

Regards,
Milos

Karthikeyan Viswanathan [Syncfusion]
Replied On January 24, 2017 12:32 AM

Hi Milos,    
  
Thanks for the update.   
  
We are glad the suggestion helped you to achieve your requirement.   
  
Please let us know if you need further assistance.   
  
Regards,    
Karthikeyan V.  


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.

;