447 comments found.
Hi!
I have to say, your theme is the best I have ever seen 
But, unfortunately I have one problem, regarding jQuery and DataTables.
I’ve implemented a few addons for Datatables (Buttons for HTML export and PDF make – this are all official Datatables extensions). And when I add them, console gives me this error: Uncaught ReferenceError: jQuery is not defined
And if I manually include jQuery file, everything is ok (except that that now jUery is included 2 times – one time in app.js, and second time manually), and obviously, because of two includes, some jQuery plugins won’t work.
Do you please have some advice how Datatables plugins should work in your setup?
Thank you very much
Hi dp41646,
Thank you for using our theme!
How about to include the datatables library after app.js? Something like this:
<!-- BEGIN: JS Assets-->
<script src="/dist/js/app.js"></script>
// Datatable addons here
<!-- END: JS Assets-->
Maybe you can try to customise Datatables build from here:
https://datatables.net/download/index
I’ve selected Buttons, Flash and HTML5 export (with jszip and pdfmake), printview and responsive.
Thank you for your help!
Please try this build, I’ve select exactly like you have listed above:
<script src="dist/js/app.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.36/pdfmake.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.36/vfs_fonts.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/v/dt/jq-3.3.1/jszip-2.5.0/dt-1.10.21/b-1.6.2/b-flash-1.6.2/b-html5-1.6.2/b-print-1.6.2/r-2.2.5/datatables.min.js"></script>
OMG, thank you! I completely forgot to include jQuery package in their download manager. Now is everything working ok. Thanks again!
You’re very welcome..
Man this theme is beautiful and well thought out!
Hi Evolutionsic,
Thank you! 
We put our creativity in every detail of this item, glad you like it..
How can I keep a modal open when clicking outside the modal area?
Hi Giovanierthal,
The option is currently not available but you can modify the modal core js file to quickly achieve this. Open this file ”/src/js/modal.js” and comment out this line:
// Line 89 - 91
$('body').on('click', function(event) {
hide(event.target)
})
Don’t forget to recompile the assets to apply changes.
The update is lovely! Thanks for adding dark mode and a slider to the recent update.
How do you advice I deploy this updates to an already running application?
Hi Samuel,
Glad you like it!
Unfortunately, there’s no simple way to apply the dark mode update to an existing applications. We decided to use the utility classes to apply the dark mode, this is to keep our core SASS files simple and easy to maintain.
So you should check the addition of utility classes on each element to apply the dark mode feature. We use the “dark:{utility class}” prefix as a modifier.
Hi, thanks for the good template But how do i add the “Dark mode” switch to the Compiled HTML theme?
Hi hassajo,
May I know your purchase code?
Please email us at: leftforcode@gmail.com
We will help you from there, thank you..
Just sent you an email. I see now that i was writing in the HTML theme. I has the Laravel and HTML theme 
Just replied your email, thank you..
Thanks
I have purchased your Midone Admin Dashboard Template, perhaps it is having problem in displaying the pages in safari browser, the login page and dashboard page does not same way in google chrome.
Kindly assist asap.
Thanks Mark
Hi Mark,
Thank you for contacting us, regarding to this post:
https://stackoverflow.com/questions/11829410/css3-gradient-rendering-issues-from-transparent-to-whiteIt seems like safari browser has an issue with css3 gradient, we will immediately find a solution and release an update on the next patch.
Thanks for this great template! does it support RTL?
Hi creative_mindes,
Thank you so much!
But unfortunately the RTL version is not available yet.
Thanks for your swift response! That’s absolutely fine.
looking forward to that
You’re very welcome..
this theme is not compatible with bootstrap
Yes, it’s not a Bootstrap template. It’s a Tailwind template, we have provided a clear spesification on the description page.
Unable to use responsive data table, not easy to integrate or develop design using this theme.
You can follow this link to use datatable with Midone, it’s fully responsive and easy to integrate.
http://midone.left4code.com/side-menu-datatable.htmli have integrate above data table, but i want to use from page http://midone.left4code.com/side-menu-regular-table.html and this responsive table with pagination.
Hi Rajneeshrupesh,
The table you mentioned here are using the same utility classes as datatable used one. So you just need to copy that classes to integrate it with your existing datatable code.
Hi, I have purchased midtone theme form themeforest. I you guide me how can i easily integrate (in modtone theme) my already developed application. current application is developed with in adminlte
Hi rajneeshrupesh,
Have you read the documentation provided with the template? Please let me know if you found any difficulties during the installation process..
this document is not in detail, only related to installation
There’s a project installation, directory structure, and used plugins in the documentation. You can check this tailwind documentation to more easily use the utility classes and integrate the template to your existing project.
https://tailwindcss.com/docs/installationHola que como estás! el modulo de Wizard no funciona!
Hi Franvk83,
We are not using any plugins for the wizard form, so it’s only a template. You can add simple jquery code to make it working depends on your need.
hi, i would like to get help on implementing tabs in profile page>>Profile Layout
if i select a tab the below content should change. any tips. ( profile, account, change password, settings)
Hi peppyday,
Most of the example tabs is not working because there’s only one tab content defined, you can add more content tab and adjust the link id to make them working properly.
<div class="nav-tabs ml-auto hidden sm:flex">
<a data-toggle="tab" data-target="#work-in-progress-new" href="javascript:;" class="py-5 ml-6 active">New</a>
<a data-toggle="tab" data-target="#work-in-progress-last-week" href="javascript:;" class="py-5 ml-6">Last Week</a>
</div>
<div class="tab-content">
<div class="tab-content__pane active" id="work-in-progress-new">
// Your content
</div>
<div class="tab-content__pane active" id="work-in-progress-last-week">
// Your content
</div>
</div>
Hey there,
When enabling the dark mode, I get a flash of the white theme – is there any way to correct this? As the flash can ruin the idea of dark mode.
Thank you.
Hi,
Yes it’s just for demo purpose, we are currently working to make more good dark mode switcher..
You can add class=”dark” to the html tag to permanently enable the dark mode version.
<html class="dark">
Thank you for writing back quickly, and yeah I wanted to preferrably just have a toggle that instantly changes but thats fine. How much of the code is Tailwind classes only, and how much is manual styling? I come from using TailwindCSS a lot, so wanted to just swap out classes to make it look unique.
It’s more like 90% of the code is written with Tailwind utility classes. We only use manual styling for some spesific CSS properties that doesn’t supported by default by Tailwind utilities.
Ohh I see, thank you lots! So by applying dark to html, it will not flicker? And moving forward, you will add a toggle that doesn’t flicker across pages?
Yes, correct!
We may separate the main theme an the dark theme in the future to remove that flicker, just add dark class to your html root tag and the dark theme will be applied without flickering.
Hi, Its possible VueJS version? or you can convert your HTML nice template to VueJS Thanks!
Hi garfrasa1977,
There will be a vuejs version released as separate item day after tomorrow, we are preparing it for production after 2 months of development..
gooooood, thanks
You’re welcome..
Hi, today upload Vuejs version release
I have been trying to make the icons appear in reactJs what am i missing? I’m using the complied version.
Please i need a reply as soon as possible. Thank you.
Hi otisidev,
We used https://feathericons.com/ as our main icon plugins, and require a function to call for initialization. Please check it here.
https://github.com/feathericons/feather#4-replaceHi, Need a help, <canvas class=”mt-3” id=”report-pie-chart” height=”280”></canvas>
how to pass variables dynamically from html to app.js
Hi peppyday,
There’s several ways to pass data to your chart, first you can use ajax from app.js like this.
(Example with jQuery)
$.post('Data Source URL').done(function(data) {
// Your chart code
new chart()
})
Or you can pass the data as HTML data property in json format and take it with jQuery from app.js.
(HTML Code)
<canvas class=”mt-3”
data-chart-labels="'["Html","Vuejs","Laravel"]'"
data-chart-data="'[15, 10, 65]'"
data-chart-background="'["#FF8B26", "#FFC533", "#285FD3"]'"
id=”report-pie-chart” height=”280”></canvas>
(Example with jQuery)
// Take the data properties
let chartLabels = JSON.parse($('#report-pie-chart').data('chart-labels'))
let chartData = JSON.parse($('#report-pie-chart').data('chart-data'))
let chartBackground = JSON.parse($('#report-pie-chart').data('chart-background'))
// Your chart code
new chart(
// Use the data above with the chart
)
Just for info you also can use the chart plugins outside the app.js if you feel it’s easier for you. Just make sure to place your code after app.js script tag.
<!-- BEGIN: JS Assets-->
<script src="https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/markerclusterer.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBG7gNHAhDzgYmq4-EHvM4bqW1DNj2UCuk&libraries=places"></script>
<script src="dist/js/app.js?v=1"></script>
<script>
// Your chart code here
</script>
<!-- END: JS Assets-->
Thanks. Worked
You’re welcome..
Hello, how are you? Loving your template! Quick question, How fo I turn the slider on by default?
<input type=”checkbox” class=”input input—switch border”>Hi,
Thank you so much for purchasing our template!
You can use “checked” property to set turn on the checkbox. Please check the following code:
<input type=”checkbox” class=”input input—switch border” checked>
Thanks, I just realized that would be the way and was going to remove the comment! thanks
You’re welcome!
can you do in the vuejs version?
Hi,
Yes, there will be vuejs version released as a separate item in 1 more week..
oh my god, i’ll be waiting … will you have a discount for those who already bought a previous version? : 3
Would there be a date for the release of the version in vuejs? I wanted to program myself, because I really want it.
Hi,
We still don’t know the date but we are sure to be released next week..
show.bs.modal event won’t fire
Hi,
Since this is not bootstrap based template “show.bs.modal” event will not work. We will add this event in the next update, thank you.
Hi, I am running a paid saas web application, I want to implement it in my website, which license I required.
Hi,
You may need extended license for that. You can check more about envato license here..
