Dynamic Theme switching not working for some components

[JohnBucherParticipant]

Hello,
I am currently trying to enable Dynamic Theme Switching for my jQWidget page and and for the most part many of the jQWidgets ARE switching as intended. The two problem components (that I at least know of) are jqxDropDownList and jqxGrid.

To focus on jqxDropDownList here is my code:

<select [(ngModel)]="theme">
    <option value='orange'>Orange</option>
    <option value='blue'>Blue</option>
</select>
<jqxDropDownList [width]="200" [height]="height" [(source)]="source" [selectedIndex]="0" [(theme)]="theme">
	</jqxDropDownList>

theme is of type string and source is an array of strings

This section of code will NOT work and will hold onto the starting theme CSS classes and will not pickup the changes to the theme variable.

BUT if you remove the source property from the DropDownList, resulting in a blank DropDownList, then it WILL correctly switch themes as intended as seen in the code below:

<select [(ngModel)]="theme">
    <option value='orange'>Orange</option>
    <option value='blue'>Blue</option>
</select>
<jqxDropDownList [width]="200" [height]="height" [(source)]="source" [selectedIndex]="0" [(theme)]="theme">
	</jqxDropDownList>

Is this intended behavior and if so how do I get around this issue?

Thank you for your time!

[JohnBucherParticipant]

I was trying to Edit my post to get my formatting right and it seems to have locked me out so the second code snippet is slightly off because I was copying the first code section that was formatting correctly. The correct second code snippet is as follows:

<select [(ngModel)]="theme">
    <option value='orange'>Orange</option>
    <option value='blue'>Blue</option>
</select>

<jqxDropDownList [width]="200" [height]="height" [selectedIndex]="0" [(theme)]="theme">
	</jqxDropDownList>

Where, again, theme is a string that is set on initialization as “orange” and source is an array of strings set to same dummy data. The source property was removed from this section of code and it suddenly starts picking up theme changes.

[MartinParticipant]

Hello JohnBucher,

Yes, you are right! Thank you for your feedback!
You can workaround this by setting the dropdown list’s theme on the select element change event.
Here is an Example.

Best Regards,
Martin

jQWidgets Team
http://www.jqwidgets.com/

[JohnBucherParticipant]

Thank you very much for your help, that worked!

[Author]

Posts