241 comments found.
i have a div section in page which use the loader to load the content into it . the dynamically loaded content also contain another click to load loader. the loader would not response on click.
Hi,
Probably you need to delegate your events to document. For example:
$(document).on( "click", ".btn", function() { ... });
Instead of:
$(".btn").on( "click", function() { ... });
i have another issue with the http://thetheme.io/theadmin/content/tables.html
selectall and selectable works on the desktop but does not work in mobile.
I’ve just tried it in both mobile view in Chrome (desktop) and an Android phone in Chrome and both works just fine. Which browser you tried?
i am testing this page on IOS chrome & safari . http://thetheme.io/theadmin/content/tables.html does not seem to work the selectall and selectable
I’ll add it to our todo list and try to fix it in the next release.
Hi,
Can you please help me … How can I change the language of jsGrid to “fr” ?
I’ve add the <script> src/i18n/fr.js file and follow the jsGrid documentation but what seems to be easy become complicated because of app.min.js …
Thanks in advance.
Hi,
We added this functionality to our local dev. Please download https://ufile.io/yyf3t which is app.min.js and replace it with the one in /assets/js/app.min.js . Then, add a data-lang=”fr” to your jsGrid to use french language. For example:
<div id="jsgrid-start" data-provide="jsgrid" data-lang="fr" />
Thanks … it works fine!
Any plans for any updates on this?
Not any major update soon. Why?
Hi,
I want to use just html5sortable from the JS code. JS has so many other libraries included. So, how can remove other unnecessary JS libraries?
Thank you advance. Ashish
Hi,
While we don’t suggest it at all, but you can remove vendors from gruntfile. You should open /theme/gruntfile.js and find “concat:core” task (line 350). Remove unused JS and CSS file and recompile the template using “grunt dist” command.
Cheers.
I did not success to use the ‘table-striped’ class on table page.
table class=”table table-striped table-bordered” cellspacing=”0” data-provide=”datatables”
Could you help me?
Do you have any JS error? Seems it should work without any problem. Our demos are striped without any problem: http://thetheme.io/theadmin/content/tables-datatables.html
Does this template comes with horizontal menu bar (Horizontal Layout).
Here’s the pre designed layouts: http://thetheme.io/theadmin/layout/layout.html . Maybe you need the Topbar menu layout.
Hello again,
A small suggestion for some css rules affecting card controls (header.card-header): replace all
.card-controls li
with a more specific rule:
.card-controls > li
Otherwise any other < li > element in the card header (not directly relatated to the card control) will be affected by that rule.
My use case is the bootstrap-select plugin: I want to use it in the card header, and I place the original < select > inside the .card-controls container. However, since the plugin will create new < li > elements, the dropdown style will be ruined by the above rule.
Hello,
Thanks for your contribution. You can expect this change in the next release.
Cheers.
Hi,
I have a problem with data-provider=”tooltip” in Vue component files. Tooltip does not work in vue files. How can I make it work?
Thank you very much.
Hi,
Do you have any error in console? Do you have an online demo?
Hello !
I need call DataTable manually, because i need working with Ajax
oTable = $('#client').DataTable({
"processing": true,
"serverSide": true,
"ajax": "{{ URL::to('ajax/client') }}",
"columns": [
{data: 'id', name: 'id'},
{data: 'name', name: 'name'}
]
});
I allways get : $().DataTable is not a function
How i can call DataTable with custom code ? i just need use code in THIS datatable, for others one is all right
Thanks !
Hello,
That’s because your code runs before loading of DataTables js file. To fix this issue you need to wrap your code inside app.ready(function() { YOUR CODE; }); as well as adding a data-provide=”datatables” to your script tag.
The other solution is to manually load the dependencies for DataTables which is ”/assets/vendor/datatables/js/jquery.dataTables.min.js” and ”../assets/vendor/datatables/css/dataTables.bootstrap4.min.css”.
Cheers.
Hello TheThemeio,
The bootstrap-select plugin you are using is now outdated. There is a fork in the repository below which has support for BS4 and has several nice improvements:
https://github.com/snapappointments/bootstrap-selectYou can also find more details about BS4 support for bootstrap-select here:
https://github.com/silviomoreto/bootstrap-select/issues/1135I just replaced the “bootstrap-select.js” and “bootstrap-select.css” files (with the respective files available at snapappointments/bootstrap-select) and my dropdown are working well.
Hope you can include it in a future release.
Hello,
Thanks for letting us know. I was watching https://github.com/silviomoreto/bootstrap-select/releases and waiting for the final release of v1.13. Seems they moved to the new place. I’ll add it to our todo list and update bootstrap-select to the new version in the future release.
Cheers.
It’s a bit confusing indeed! I don’t know if the snapappointments/bootstrap-select fork is temporary or not. Either way, the guy who seems to be maintaining the plugin is Casey Holzer (caseyjhol on github).
I looked into issues to find an answer why they moved to this repository, and here’s the answer: https://github.com/snapappointments/bootstrap-select/issues/12
I guess we’ll consider the new repo as the official one!
I tried to change the border-color of custom control radio and checkbox. I do not know how to change. Let me know.
Please inspect the elements and see the ::before element. That’s the box. You can change the color with a code like this:
.custom-control-label::before {
border-color: red;
}
How to fix the footer in the bottom of page?
You should write custom css for this purpose. Maybe something like this:
.site-footer {
position: fixed;
bottom: 0;
width: 100%;
}
Thank you
Hi, it seems there’s a Javascript error when trigering the Modaler plugin with some options. Just click the “Launch demo modaler” button under “Some Options” in this page : http://thetheme.io/theadmin/uikit/dialog-modal.html and you should see the error in the chrome console that says “Uncaught TypeError: h is not a function”. This error avoid further code to be executed in my script, so I would like to know how I can fix this please.
Thank you.
It only happens when using the ‘html’ option (‘url’ option works well).
Hi,
Sorry about the issue. We fixed the problem and include the bug fix in the next release. Meanwhile, you can download the updated js file from https://ufile.io/p7qee and replace it with your /assets/js/app.min.js
Let us know if you need more help.
Cheers.
Hello,
Bootstrap selectpicker element is always staying front of the div which is have “card-loading reveal” classes. http://thetheme.io/theadmin/layout/card-advanced.html
https://image.ibb.co/bKiz2y/oba.png
I’ve managed to solve this issue with applying z-index to 99999 (<div class="card-loading reveal" style="z-index:99999 !important;" />). Posted this for your information…
Hello,
Thanks for sharing this fix. We’ll include it with the next release.
Hello, I would like to add Carousel in the Header, is it possible? how can I do it?
Thank you.
Hello,
We don’t have a direct sample for that, but you should be able to add a carousel to your header without any problem. A header is simply a container for your elements. You can see example of carousels in this link: http://thetheme.io/theadmin/uikit/carousel.html
Cheers.
Hi there,
I’m using this theme for my Rails project. I’m getting the following error:
ActionView::Template::Error (Undefined variable: ”$zindex-morris”.):
Any help would be appreciated.
Thank you! Ashish
Hi,
Where you get this error? It doesn’t seem to be a JS error.
material input , if set autofocus , overlap with label text .
ex HTML Code：
<input type=”text” class=”form-control” autofocus=”true”> <label>Normal input</label>
Sorry about the issue. I add it to our todo list to fix the issue in the next release.
We need the bootstrap datetimepicker. Can it be added?
We already have date picker and time picker separately ( http://thetheme.io/theadmin/form/picker-datetime.html ). We don’t have any plan to add bootstrap datetimepicker but you can add it to your /assets/plugin/ directory, load it into your page, and configure it as you wish.
Hello,
How to resize emojione icons?
<p data-provide="emoji" class="fs-24">Here is a sample wink :wink:</p>
above code is resizing the text but not resizing the icon
Hello,
If you inspect the icon, you’ll see it’s a SVG icon. To increase the size, you should change the width and height of SVG. So you might have a style like the follow and add the .svg-24 to your p tag.
.svg-24 > svg {
width: 24px;
height: 24px;
}
huuh! i can see it’s a dummy question but i am not that good at front-end 
thank you again for the support though
Hello,
I would like to edit the theme colors but I don’t see any scss file to do that like in your the Saas theme. Did i miss something ?
Thanks
Hello,
Yes, TheAdmin doesn’t have theme.scss file to change the variables. For this purpose, you should use the /theme directory to access SCSS files, modify variables and recompile the SCSS and JS files.
