Hi Muhammad,
Thanks for contacting Syncfusion support.
We have analyzed the query to “Change the default theme in the mainlayout”. We can achieve this with the following two cases.
Case1: Referring the CSS file (of required theme) initially in layout.cshtml page to render the Control.
Please refer the below code snippet to refer the required CSS file in layout.cshtml page.
|
<environment names="Development">
<link rel='nofollow' href="~/lib/syncfusion-javascript/Content/ej/web/default-theme/ej.web.all.min.css" rel="stylesheet" />
<script src="~/lib/jquery/dist/jquery.js"></script>
</environment> |
Here, the control will be rendered with the initial referred theme as specified in layout.cshtml file.
Case2: Change the theme on Page load
We can dynamically change the theme of the control on page load using a “id” to the CSS being referred initially and change it on page load by using the function shown below.
Set id to the CSS reference.
|
<environment names="Development">
<link rel='nofollow' href="~/lib/syncfusion-javascript/Content/ej/web/default-theme/ej.web.all.min.css" rel="stylesheet" id="mycss" />
<script src="~/lib/jquery/dist/jquery.js"></script>
</environment> |
Please refer the below script in you index.cshtml file to change the theme of the control on page load.
|
<script>
$(document).ready(function () {
$('#mycss[rel=stylesheet]').attr('rel='nofollow' href','http://cdn.syncfusion.com/15.1.0.33/js/web/flat-lime/ej.web.all.min.css');
});
</script> |
Regards,
Prem Kumar.M
