EasyUI Forum
September 18, 2024, 07:26:31 AM *
Welcome, Guest. Please login or register.

Login with username, password and session length
News:
 
   Home   Help Search Login Register  
Pages: [1]
  Print  
Author Topic: How to change Easyloader theme @ run-time?  (Read 2986 times)
WizPS
Jr. Member
**
Posts: 67


View Profile
« on: April 21, 2020, 08:12:55 AM »

I would like to let the user change skin by selecting a theme from combo box. I have fond posts about changing the CSS reference via giving it an id. However it’s probably not the correct solution in my case. The ribbon menu pictures gets lost and it looks overall strange. I believe the reason for this is that my app is using easyloader. At initial page-load my code sets the theme like so:

easyloader.theme = 'material-teal';
easyloader.locale = 'se_SW';

How can I implement a method for changing easyloader.theme and re-render the page to have this theme taking effect?
Logged
jarry
Administrator
Hero Member
*****
Posts: 2274


View Profile Email
« Reply #1 on: April 22, 2020, 01:06:54 AM »

To change themes when using easyloader, please set the 'css' property to false and then add a theme to the page.
Code:
<link rel="stylesheet" type="text/css" href=".../easyui.css">
Code:
<script type="text/javascript">
easyloader.css = false;
function changeTheme(v){
$('link:first').attr('href',v);
setTimeout(function(){
//...;
},0);
}
</script>

Usage example:
Code:
<select onchange="changeTheme(this.value)">
<option value="https://www.jeasyui.com/easyui/themes/default/easyui.css">Default</option>
<option value="https://www.jeasyui.com/easyui/themes/gray/easyui.css">Gray</option>
<option value="https://www.jeasyui.com/easyui/themes/metro/easyui.css">Metro</option>
<option value="https://www.jeasyui.com/easyui/themes/black/easyui.css">Black</option>
<option value="https://www.jeasyui.com/easyui/themes/material/easyui.css">Material</option>
<option value="https://www.jeasyui.com/easyui/themes/material-teal/easyui.css">Material Teal</option>
...
</select>
Logged
Pages: [1]
  Print  
 
Jump to:  

Powered by MySQL Powered by PHP Powered by SMF 1.1.18 | SMF © 2013, Simple Machines Valid XHTML 1.0! Valid CSS!