12208 comments found.
We are facing issue in Metronic Angular template, when we click on any link/tab and after it loads then breadcrumb is lost and Left menu navigation focus is also lost. Can you please suggest any solution for that.
Hi,
Thank you for your feedback. We will check this issue and provide the fix for it.
Thanks
Hi 
We requires more information about the issue. Do you mean this tab? Please check the screenshot in the link below.
https://www.loom.com/share/a86150344b684112b7e0a3c852a93889Thanks
Hello! I have Metronic v8.0.28 template 9 Fancy Dashboard.
it will be used mainly from tablets in horizonta mode. However there is “blocker” issue with left said menu. I have 6 menu items and starting in approx. 650px height menu buttons starting to be hidden and soon enough ~550 you can not access 1st item at all.
by removing footer button Its improves a bit, but not solve. And that button is needed for me
Would appreciate if you would provide some suggestions. Thanks.
Hi
,
Thanks for your interest in Metronic. Possible solution can be reducing the icon size a bit through SASS variables menu-icon>
\src\sass\layout\_variables.scss
However the aside menu is scrollable in case if your device height i smaller than general.
For more info about using Metronic please check the theme documentation https://preview.keenthemes.com/metronic8/demo1/documentation/getting-started.html and video tutorials https://preview.keenthemes.com/metronic8/demo1/documentation/getting-started/video-tutorials.html
Regards, Sean
Hi! Thanks for answer. But that is the thing with scrollable – it scrolling, but some how in one point it reach some limit and do not show all items. Please try your self. Basically items hides behind logo.
Hi
,
Good spot. We will release the fix in the next update. In the meantime you can fix it easily by just adding “my-auto” as shown below:
<div id="kt_aside_menu" class="menu my-auto ...">...</div>
Regards, Sean
nice
. Thank!
Is it possible to get a refund for this? Bought it for the version 8 angular version, but I’m pretty dissapointed. I wan’t to go for an other angular admin panel.
Hi,
Thanks for your interest in Metronic. We are working on Metronic 8 Angular and in a few weeks we will start releasing major updates including CRUD, Google Materail UI integration, etc.
If you like to proceed with refund please contact our support via support@keenthemes.com
Regards, Sean
hi.. i use KTDatatable and how to make function at button edit or delete..
Hi 
You can do this.
1) Add button in action column using a template option. Put the data-id of the current data row.
2) Add click event to the button
$(datatable).on('click', '.button-action', function() {
var dataId = $(this).attr("data-id");
console.log(dataId);
// send delete request here to your backend
// then remove it from your database
}
Depending on which datasource you are using, if you use remote datasource, you can send the delete request to your backend service. And then reload the datatable with the new data using reload() function.
Let us know if you need further clarifications.
Thanks
thanks.. very helpfully
im using select bootstarp how to make dropdwon align right to left and how to make width auto if text over from col-lg?
Hi,
Can you please clarify which select dropdown component are you using?
Regards, Sean
i use bootstrap-select
one thing i kind use KTDatatable and how to filter using numberic because if value equal 1 then datatable.search 1 also 11,12,13.. etc. so how to search value 1 then search find only 1, if value = 2 then search also 2.. please help me
$(’#kt_datatable_search_status’).on(‘change’, function() { datatable.search($(this).val().toLowerCase(), ‘Status’); });
sory i forgot.. how to make a little narrow between
Hi,
For the bootstrap select element you should add data-container=”body” to fix the overfow issue caused by it’s parent.
Regards, Sean
Hi,
Are you using local data source. The KTDatatable local search only support “like” filter. To use exact filter, you have to use the remote data source.
You can check the sample of remote datasource here theme/html/demo1/src/js/pages/crud/ktdatatable/base/data-ajax.js
Thanks
I have a problem with the “dropdown” when adding it inside the “TopBar”. (It does not have an overflow)
https://imgur.com/a/m89yabd
I had previously reported it, and you guys recommended me to use select2, but by design I can’t use it.
I hope you can help me Thank you
Hi,
First of all, please try to get the latest Metronic v8.0.28. To use the Bootstrap Dropdown you can remove the overflow-hidden class. As an alternative solution you can use KTMenu as we used in demo1.
Regards, Sean
Hi .
When I use a table with class = “table-bordered border-primary” it doesn’t workhttps://imgur.com/a/4YuWBOZ
And when I use it with the Datatables plugin it doesn’t work either
https://imgur.com/a/NJacyNT
I hope you can help me thanks
Hi,
Thank for your feedback. We will double check it further and try to provide a fix in the next update. If you need this quick fix urgently pleas e contact our support via support@keenthemes.com and we will provide you the hot fix.
Regards, Sean
Hi, is there support for bootstrap modals? Seems that none of the modals are working in Angular demo1.
According to the docs it says it’s supported, but doesn’t seem to work.
https://preview.keenthemes.com/metronic8/demo1/documentation/base/modal.htmlHi,
Our angular use the components from ng bootstrap. Please use the modal function from ng-bootstrap. Please check here for more information.
https://ng-bootstrap.github.io/#/components/modal/examplesThanks
Thanks!
Hello this problem I reported a couple of months ago.
It is in the Datatables component
$ (’# myTable’). DataTable ({
select: true
});
The colors do not work correctly when having in the table class = “table-striped”
I hope you can help me thanks
Hi
,
Thanks for reminding this. We will double check and try to provide a fix in the next update.
Regards, Sean
Hello
This issue was reported a couple of months ago and there is still no solution
I have a problem with bootstrap 5 theme 1 The Toolbar not working with dropdown, I checked the metronic version with bootstrap 4.6 and it working correctly.
Also the toolbar shows a scrollbar to the overflow. (limiting the display of content)
https://imgur.com/a/VtoRBFJ
https://imgur.com/a/HumJ5oS
I need to download version 7 with bootstrap 4.. when downloaded i got only version 8… with bootstrap 5
please advice what to do…
Regards, Vijey
Hi
,
Please contact our support via support@keenthemes.com and let us know your github username and we will grant you access to our private Metronic repo so you can download previous versions easily.
Regards, Sean
Hi Sean,
I have sent you the email to support and my themeforest id is raghavan2004 .. for your reference
Thanks a lot.
Regards, Vijey
Hi
,
Sure, we have granted the access already.
All the best with your project!
Regards, Sean
Thanks I got an email too regarding the access
Regards, Vijey
hello. i’m using metronic 7 for a project and wanted to update it to latest version but couldn’t download it. could you provide download link of latest version of 7.xx, please?
Hi,
Could you please send our support via support@keenthemes.com your github username and we will grant you access to our Metronic Github repo and you can download previouse Metronic versions easily.
Regards, Sean
Hi Hi! Again I was waiting for the error to be accommodated, my client needs to solve this, it seems that they no longer support the demo 01 version react, my client bought this template with the exclusive use of react, and they have time without updating or supporting the errors , we need to give us a date, they can not continue playing with our time.
Hi,
Thanks for your patience. No worries, we are checking this now and get back to you shortly.
Regards, Sean
Hello keenthemes,
We are waiting for the Minimalist Dashboard theme with my teammates. When will this theme be published as HTML? I want to quickly apply it to our project.
Or if there is an example such as a demo, we can use a certain part of it until it arrives. Of course if you let
Hi
,
Stay tuned for updates via https://twitter.com/keenthemes and https://www.instagram.com/keenthemes
Regards, Sean
Thank you very much for the comment. So, will the minimalist dashboard come in metronic 7? We had a hard time integrating Metronic 8 in our own project. Plugin.js amounted to 10mb. Metronic 7 seemed like a better solution to us.
Hi,
Our future updates will be for Metronic 8 and Bootstrap 5. Please check out our video tutorial https://preview.keenthemes.com/metronic8/demo1/documentation/getting-started/video-tutorials.html and manage your build by removing unused plugins. There should not be any issue with Metronic 8 plugins bundle. If you need any further help please contact our support via support@keenthemes.com
Regards, Sean
Hi keenthemes,
Can flatpickr support locales out of the box in metronic, or should we import the i10 files in html as said in flatpickr docs ?
Are you planning to make it as you did in Metronic7 ?, like here’s the code of a datepicker in metronic7 :
// inline picker
$('#kt_datepicker_6').datepicker({
rtl: KTUtil.isRTL(),
todayHighlight: true,
templates: arrows,
language: "ru"
});
.just to know if you don’t plan to mke it this way, so we go the import javascript inline file route. so we don’t go back.or wait if you are to plan it.
thank you so much Keenthemes .
Hi,
Yes, for each 3rd-party plugin i18n setup is up to users according to their project requirements. Basically to enable the i18n support you will need to include additional files in the gulp or webpack config and update the initialization code according to a plugin documentation.
Regards, Sean
I understand,
Do you mind to point us, where to add flatpickr locales with webpack ?
We already saw that folder ”../node_modules\flatpickr\dist” has already all the locales in I10 subfolder , but how do we tell webpack to export them in the metronic8 “demo6\dist\assets\js\custom\documentation\forms\flatpickr\I10” dist folder ?
do we have to inlude js locales here in “scripts” section in gulp.config.js file, : ?
flatpickr: {
styles: [
"{$config.path.node_modules}/flatpickr/dist/flatpickr.css",
],
scripts: [
"{$config.path.node_modules}/flatpickr/dist/flatpickr.js",
"{$config.path.common_src}/js/vendors/plugins/flatpickr.init.js",
----- here -----
],
},
thank you in advance Sean.
Hi,
According to the documentation https://flatpickr.js.org/localization/ you will need to add “l10n/ru.js” into the bundle in core\html\tools\gulp.config.js>
flatpickr: {
styles: [
"{$config.path.node_modules}/flatpickr/dist/flatpickr.css",
],
scripts: [
"{$config.path.node_modules}/flatpickr/dist/flatpickr.js",
"{$config.path.node_modules}/flatpickr/dist/l10n/ru.js",
"{$config.path.common_src}/js/vendors/plugins/flatpickr.init.js",
],
}
Regards, Sean
Thank you so much Sean. I’ll try to Compile it and get back to you, hopefully it’ll work.
Compiled it, no errors, but there”s no “ru.js” file whatsoever in /dist ???
Even the faltpickr stays in english/default
any thought ??
Hi,
Do you have any JS errors in your console? The ru.js file is in the node_modules folder under flatpickr folder.
Have you explicitly setup the locale as per the documentation: https://flatpickr.js.org/localization/
flatpickr(myElement, {
"locale": "ru" // locale for this instance only
});
Regards, Sean
I”m aware that ru.js file is in the node_modules folder under flatpickr folder..
and yes I explicitly setup the locale as per the documentation:.
and yes ther”s a JS errors in your console since there”s no ru.js built dist : here’s the error :
“Error: flatpickr: invalid locale ru”
NB : Tehre’s no ru.js file in /dist/assets/* folder, the probleme is in webpack compilling.not export the ru.js file to /dist
Thank you sean
Oh, if you are using webpack you will need to add the file in:
core\html\tools\webpack\plugins\plugins.js:
// Flatpickr - is a lightweight and powerful datetime picker.
require('flatpickr/dist/flatpickr.min.js');
require('flatpickr/dist/i18n/ru.js');
require('@/src/js/vendors/plugins/flatpickr.init.js');
Regards, Sean
I knew it, LoL Because I went back to Metronic7 and I found those require lines for datepikers locales .
Hope this time it will be it.
I guess this is the same thing to get datatables locales ?
thank you.
Hi
,
Sure, you can include additional files of 3rd-party plugins in webpack config.
Regards, Sean
Hi keenthemes,
Swapper doesn’t work on modals, any idea ?
used the same exact example here : https://preview.keenthemes.com/metronic8/demo1/documentation/general/swapper.html
thank you.
Hi,
Can you please send us your full HTML code and we can try to reproduce the issue. You can email the code sample via support@keenthemes.com
Regards. Sean
<div id="CRUD_modal_view_md" class="modal fade show" tabindex="-1" style="display: block; padding-left: 0px;" aria-modal="true" role="dialog">
<div class="modal-dialog modal-md">
<div id="CRUD_modal_view_content_md" class="modal-content CRUD_modal_content tassnim"><div class="modal-header py-5">
<div class="d-flex ">
<!--begin::Svg Icon-->
<span class="svg-icon svg-icon-3x svg-icon-dark me-2 align-self-center">
<!--?xml version="1.0"?-->
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:svgjs="http://svgjs.com/svgjs" version="1.1" width="512" height="512" x="0" y="0" viewBox="0 0 512 512" style="enable-background:new 0 0 512 512" xml:space="preserve"><g>
<g xmlns="http://www.w3.org/2000/svg">
<g>
<path d="M316.125,330.622h-15.031v-30.063h45.094c8.301,0,15.031-6.73,15.031-15.031c0-8.301-6.73-15.031-15.031-15.031h-60.125 c-8.301,0-15.031,6.73-15.031,15.031v60.125c0,8.301,6.73,15.031,15.031,15.031h30.063c8.288,0,15.031,6.743,15.031,15.031 s-6.743,15.031-15.031,15.031h-30.063c-8.301,0-15.031,6.73-15.031,15.031c0,8.301,6.73,15.031,15.031,15.031h30.063 c24.865,0,45.094-20.229,45.094-45.094S340.99,330.622,316.125,330.622z" fill="#000000" data-original="#000000" style=""></path>
</g>
</g>
<g xmlns="http://www.w3.org/2000/svg">
<g>
<path d="M225.937,390.747h-33.82l36.088-48.116c5.891-7.851,9.005-17.202,9.005-27.04c0-24.865-20.229-45.094-45.094-45.094 c-24.865,0-45.094,20.229-45.094,45.094c0,8.301,6.73,15.031,15.031,15.031c8.301,0,15.031-6.73,15.031-15.031 c0-8.288,6.743-15.031,15.031-15.031s15.031,6.743,15.031,15.031c0,3.281-1.033,6.392-2.99,9.001l-54.129,72.168 c-3.416,4.555-3.965,10.648-1.419,15.741c2.545,5.093,7.75,8.309,13.444,8.309h63.884c8.301,0,15.031-6.73,15.031-15.031 C240.969,397.477,234.239,390.747,225.937,390.747z" fill="#000000" data-original="#000000" style=""></path>
</g>
</g>
<g xmlns="http://www.w3.org/2000/svg">
<g>
<path d="M436.376,59.056h-15.031V45.094C421.345,20.229,401.115,0,376.251,0s-45.094,20.229-45.094,45.094v13.962H180.843V45.094 C180.843,20.229,160.614,0,135.749,0S90.655,20.229,90.655,45.094v13.962H75.624c-24.865,0-45.094,20.229-45.094,45.094v362.756 C30.53,491.771,50.759,512,75.624,512h360.752c24.865,0,45.094-20.229,45.094-45.094V104.15 C481.47,79.285,461.241,59.056,436.376,59.056z M361.219,45.094c0-8.288,6.743-15.031,15.031-15.031s15.031,6.743,15.031,15.031 v60.125c0,8.288-6.743,15.031-15.031,15.031s-15.031-6.743-15.031-15.031V45.094z M120.718,45.094 c0-8.288,6.743-15.031,15.031-15.031c8.288,0,15.031,6.743,15.031,15.031v60.125c0,8.288-6.743,15.031-15.031,15.031 s-15.031-6.743-15.031-15.031V45.094z M451.407,466.906c0,8.288-6.743,15.031-15.031,15.031H75.624 c-8.288,0-15.031-6.743-15.031-15.031V209.369h390.814V466.906z M451.407,179.307H60.593V104.15 c0-8.288,6.743-15.031,15.031-15.031h15.031v16.101c0,24.865,20.229,45.094,45.094,45.094c24.865,0,45.094-20.229,45.094-45.094 V89.119h150.313v16.101c0,24.865,20.229,45.094,45.094,45.094s45.094-20.229,45.094-45.094V89.119h15.031 c8.288,0,15.031,6.743,15.031,15.031V179.307z" fill="#000000" data-original="#000000" style=""></path>
</g>
</g>
<g xmlns="http://www.w3.org/2000/svg">
</g>
<g xmlns="http://www.w3.org/2000/svg">
</g>
<g xmlns="http://www.w3.org/2000/svg">
</g>
<g xmlns="http://www.w3.org/2000/svg">
</g>
<g xmlns="http://www.w3.org/2000/svg">
</g>
<g xmlns="http://www.w3.org/2000/svg">
</g>
<g xmlns="http://www.w3.org/2000/svg">
</g>
<g xmlns="http://www.w3.org/2000/svg">
</g>
<g xmlns="http://www.w3.org/2000/svg">
</g>
<g xmlns="http://www.w3.org/2000/svg">
</g>
<g xmlns="http://www.w3.org/2000/svg">
</g>
<g xmlns="http://www.w3.org/2000/svg">
</g>
<g xmlns="http://www.w3.org/2000/svg">
</g>
<g xmlns="http://www.w3.org/2000/svg">
</g>
<g xmlns="http://www.w3.org/2000/svg">
</g>
</g></svg>
</span>
<!--end::Svg Icon-->
<div class="d-flex justify-content-center flex-column ">
<h2 class=" text-dark fw-bolder my-1 mb-0">
Rendez-vous
</h2>
<div class="text-muted fw-bold fs-7 mb-0 ">
« Détails »
<span class="h-15px border-gray-300 border-start ms-1 mx-2" />
<span class="badge badge-light-success fw-bolder">#
13
</span>
</div>
</div>
</div>
<div class="d-flex justify-content-end align-items-center flex-shrink-0">
<!-- Metronic - 7.0.6 - 10 Jully 2020 -->
<!-- end tags -->
<a class="btn btn-light btn-active-warning btn-sm fs-bold " href="javascript:;" data-bs-toggle="modal" data-bs-target="#CRUD_modal_form_md" hx-get="/appointments/change_modal/13" hx-target="#CRUD_modal_form_content_md" hx-swap="innerHTML">
<i class="fas fa-pencil-alt fs-4" />
<span class="d-sx-none">Modifier</span>
</a>
<span class="h-20px border-gray-200 border-start ms-3 mx-2" />
<!-- either change, view CBV, has by default "object" = using object variable to check -->
<!-- Infos. système -->
<!-- Metronic - 6.1.2 - 23 October 2019 -->
<!-- begin tags -->
<!-- end tags -->
<!-- Infos. système -->
<!--begin::Block-->
<div class="">
<!--begin::Trigger-->
<button type="button" class="btn btn-sm btn-icon btn-secondary btn-color-muted btn-active-dark me-2" data-kt-menu-trigger="click" data-kt-menu-placement="bottom-end" data-bs-dismiss="click" data-bs-toggle="tooltip" data-bs-placement="bottom" title="" data-bs-original-title="Infos. système">
<!--begin::Svg Icon | path: icons/duotune/arrows/arr072.svg-->
<!--begin::Svg Icon | path: icons/duotone/Layout/Layout-horizontal.svg-->
<span class="svg-icon svg-icon-1 ">
<!--?xml version="1.0"?-->
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:svgjs="http://svgjs.com/svgjs" width="512" height="512" x="0" y="0" viewBox="0 0 23.625 23.625" style="enable-background:new 0 0 512 512" xml:space="preserve" class=""><g>
<g xmlns="http://www.w3.org/2000/svg">
<path style="" d="M11.812,0C5.289,0,0,5.289,0,11.812s5.289,11.813,11.812,11.813s11.813-5.29,11.813-11.813 S18.335,0,11.812,0z M14.271,18.307c-0.608,0.24-1.092,0.422-1.455,0.548c-0.362,0.126-0.783,0.189-1.262,0.189 c-0.736,0-1.309-0.18-1.717-0.539s-0.611-0.814-0.611-1.367c0-0.215,0.015-0.435,0.045-0.659c0.031-0.224,0.08-0.476,0.147-0.759 l0.761-2.688c0.067-0.258,0.125-0.503,0.171-0.731c0.046-0.23,0.068-0.441,0.068-0.633c0-0.342-0.071-0.582-0.212-0.717 c-0.143-0.135-0.412-0.201-0.813-0.201c-0.196,0-0.398,0.029-0.605,0.09c-0.205,0.063-0.383,0.12-0.529,0.176l0.201-0.828 c0.498-0.203,0.975-0.377,1.43-0.521c0.455-0.146,0.885-0.218,1.29-0.218c0.731,0,1.295,0.178,1.692,0.53 c0.395,0.353,0.594,0.812,0.594,1.376c0,0.117-0.014,0.323-0.041,0.617c-0.027,0.295-0.078,0.564-0.152,0.811l-0.757,2.68 c-0.062,0.215-0.117,0.461-0.167,0.736c-0.049,0.275-0.073,0.485-0.073,0.626c0,0.356,0.079,0.599,0.239,0.728 c0.158,0.129,0.435,0.194,0.827,0.194c0.185,0,0.392-0.033,0.626-0.097c0.232-0.064,0.4-0.121,0.506-0.17L14.271,18.307z M14.137,7.429c-0.353,0.328-0.778,0.492-1.275,0.492c-0.496,0-0.924-0.164-1.28-0.492c-0.354-0.328-0.533-0.727-0.533-1.193 c0-0.465,0.18-0.865,0.533-1.196c0.356-0.332,0.784-0.497,1.28-0.497c0.497,0,0.923,0.165,1.275,0.497 c0.353,0.331,0.53,0.731,0.53,1.196C14.667,6.703,14.49,7.101,14.137,7.429z" fill="#030104" data-original="#030104" class=""></path>
</g>
<g xmlns="http://www.w3.org/2000/svg">
</g>
<g xmlns="http://www.w3.org/2000/svg">
</g>
<g xmlns="http://www.w3.org/2000/svg">
</g>
<g xmlns="http://www.w3.org/2000/svg">
</g>
<g xmlns="http://www.w3.org/2000/svg">
</g>
<g xmlns="http://www.w3.org/2000/svg">
</g>
<g xmlns="http://www.w3.org/2000/svg">
</g>
<g xmlns="http://www.w3.org/2000/svg">
</g>
<g xmlns="http://www.w3.org/2000/svg">
</g>
<g xmlns="http://www.w3.org/2000/svg">
</g>
<g xmlns="http://www.w3.org/2000/svg">
</g>
<g xmlns="http://www.w3.org/2000/svg">
</g>
<g xmlns="http://www.w3.org/2000/svg">
</g>
<g xmlns="http://www.w3.org/2000/svg">
</g>
<g xmlns="http://www.w3.org/2000/svg">
</g>
</g></svg>
</span>
<!--end::Svg Icon-->
</button>
<!--end::Trigger-->
<!--begin::Menu-->
<div class="menu menu-sub menu-sub-dropdown menu-column menu-rounded menu-gray-600 menu-state-bg-light-primary fw-bold fs-7 w-425px py-4" data-kt-menu="true">
<div class="text-end text-gray-600 fw-bold fs-7 px-5">- Par : </div>
<div class="separator separator-dashed my-3" />
<!--Created-->
<!--begin::Item-->
<div class="d-flex flex-stack px-5">
<!--begin::Label-->
<div class="fw-bold ">
<div class="text-gray-800 fw-bold fs-7 my-1">Ajouté le :</div>
<div class="text-gray-600 fw-bold fs-7"><code>18 octobre 2021 08:35</code></div>
</div>
<!--end::Label-->
<!--begin::Section-->
<div class="d-flex align-items-center ">
<div class="text-end">
<span class="fs-7 text-muted fw-bold mt-1">« Non Défini »</span>
</div>
</div>
<!--end::Section-->
</div>
<!--end::Item-->
<div class="separator separator-dashed my-3" />
<!--Updated-->
<!--begin::Item-->
<div class="d-flex flex-stack px-5">
<!--begin::Label-->
<div class="fw-bold ">
<div class="text-gray-800 fw-bold fs-7 my-1">Modifié le :</div>
<div class="text-gray-600 fw-bold fs-7"><code>18 octobre 2021 08:35</code></div>
</div>
<!--end::Label-->
<!--begin::Section-->
<div class="d-flex align-items-center ">
<div class="text-end">
<span class="fs-7 text-muted fw-bold mt-1">« Non Défini »</span>
</div>
</div>
<!--end::Section-->
</div>
<!--end::Item-->
<div class="my-3" />
</div>
<!--end::Menu-->
</div>
<!--end::Block-->
<!--begin::Close-->
<button type="button" data-bs-dismiss="modal" class="btn btn-sm btn-icon btn-active-light " id="kt_explore_close">
<!--begin::Svg Icon | path: icons/duotone/Navigation/Close.svg-->
<span class="svg-icon svg-icon-2 svg-icon-">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="24px" height="24px" viewBox="0 0 24 24" version="1.1">
<g transform="translate(12.000000, 12.000000) rotate(-45.000000) translate(-12.000000, -12.000000) translate(4.000000, 4.000000)" fill="#000000">
<rect fill="#000000" x="0" y="7" width="16" height="2" rx="1"></rect>
<rect fill="#000000" opacity="0.5" transform="translate(8.000000, 8.000000) rotate(-270.000000) translate(-8.000000, -8.000000)" x="0" y="7" width="16" height="2" rx="1"></rect>
</g>
</svg>
</span>
<!--end::Svg Icon-->
</button>
<!--end::Close-->
</div>
</div>
<div class="modal-body">
<div class="row g-10">
<div class="col-lg-6">
<div class="bg-light-primary h-100 p-5" id="kt_docs_swapper_parent_1">
<div class="fw-boldest">Parent Element 1</div>
<!--begin::Swapper-->
<div class="mt-3" data-kt-swapper="true" data-kt-swapper-mode="append" data-kt-swapper-parent="{
default: " md:="" lg:="" xl:="">
This HTML element will swap parent elements on different screen breakpoints
</div>
<!--end::Swapper-->
</div>
</div>
<div class="col-lg-6">
<div class="bg-light-info h-100 p-5" id="kt_docs_swapper_parent_2">
<div class="fw-boldest">Parent Element 2</div>
</div>
</div>
<div class="col-lg-6">
<div class="bg-light-warning h-100 p-5" id="kt_docs_swapper_parent_3">
<div class="fw-boldest">Parent Element 3</div>
</div>
</div>
<div class="col-lg-6">
<div class="bg-light-success h-100 p-5" id="kt_docs_swapper_parent_4">
<div class="fw-boldest">Parent Element 4</div>
</div>
</div>
</div>
</div>
<!--end::modal-body-->
<div class="modal-footer py-5">
<!-- Metronic - 6.1.2 - 23 October 2019 -->
<!-- begin tags -->
<!-- end tags -->
<button type="button" class="btn btn-light" data-bs-dismiss="modal"><i class="fas fa-times fs-2x" />
Fermer
</button>
<!-- end::modal_footer -->
</div>
<!--end::Modal-->
<!--begin::Page Vendors Javascript(used by this page)-->
<!--end::Page Vendors Javascript-->
<!--begin::Page Custom Javascript(used by this page)-->
<!--end::Page Custom Javascript-->
<!-- ModalLocalInitJavascript -->
<script type="text/javascript">
KTApp.init();
</script>
<!-- ModalLocalInitJavascript --></div>
</div>
</div>
sorry for the indentation, I was experimenting.
Hi
,
Sorry for the late reply on this. In order to fully investigate the issue can you please provide the full code ? The swapper plugins html attribute values are not visible. Can you please use public gist https://gist.github.com/ to show your code so we can copy and paste it and reproduce the issue here.
Regards, Sean
Basically it’s taking the Swapper of the normal and put them on a modal, that”s what I did, but unfortunatly doesn’t work !
could you provide an example in the doc for the swapper modal use ?
thank you.
Hi,
Noted, we will double check it and update the docs soon.
Regards, Sean
Why in the html folder i can’t found the filemanger App, for none demo ??? Thank.
Valerio
Hi,
You can find the file manager pages in this folder;
/html/theme/demo1/dist/apps/file-manager/*
And the JS init files in this folder;
/html/theme/demo1/src/js/custom/apps/file-manager
Thanks
Hi keenthemes.
Thank you for the bootstrap toast, it is amazing (we did switch to bootstrap toast, better than toaster).
Thank you also for input-group it looks sick in matter of UI, wonderfull, but we really would like if you supplly it’s validation state.
We really appreciate if you could supply the avatar image resize befiore submit in the avatar box, we talked you about. hopefully next release.
Also full callendar event custom color.
Thank you so much guys
Hi
,
Thanks for the feedback. Glad to hear that you liked the new update. Sure, we implement those features in a future update.
Regards, Sean
Hi, your Dropdown not working in Ajax Datatable
Hi
,
Can you please prepare more info ? Which Metronic version are you using ? In Metronic v8 https://preview.keenthemes.com/metronic8/demo1/documentation/general/datatables/server-side.html the ajax datatables with ktmenu works fine. For any further help please contact our support via support@keenthemes.com and provide us more details.
Regards, Sean
Hi, it’s Metronic 8 and it works fine in your demo but when I tried it on locally(Laravel) it didn’t work out
Please return dropdown code from Laravel controller and you’ll see it’s not working
Hi,
Can you add try to init KTMenu on datatable draw event:
var dt = $("#kt_datatable_example_1").DataTable();
// Re-init functions on every table re-draw -- more info: https://datatables.net/reference/event/draw
dt.on('draw', function () {
initToggleToolbar();
toggleToolbars();
handleDeleteRows();
KTMenu.createInstances();
});
Regards, Sean
Oh my bad, I have to initialize it, Thank you so much, I’ll check it. Thanks once again <3
Sure
Good luck with your project!
Hi Sean,
I’m having another issue, I checked the documentation but I didn’t found anything about tooltip, it’s not working in ajax reloaded html.
Regards, Ameer
Hi:),
To initialize all core components you just need to call KTApp.init() in your ajax response callback.
Regards, Sean
We are facing an issue in Metronic Angular template, everything is loading on double click, like menu, button, paging. On first click data is NOT loading but on second click its loading. What could be the solution.
Hi,
We use ChangeDetection.OnPush.
ChangeDetection.OnPush strategy is just performance improvements https://www.digitalocean.com/community/tutorials/angular-change-detection-strategy
Use detectChanges() function to update the view.
constructor(private cd: ChangeDetectorRef) {}
refresh() {
this.cd.detectChanges();
}
You can set ChangeDetection.Default mode, then no need to call ChangeDetectorRef.detectChanges() method.
Thanks
Hello, I am using Metronic 8.0.28 Laravel version, How can I use the main / route? every time I try to access for example domain.com it redirects me to domain.com/login and i want to do some stuff with the main domain, what should I do to access my main / without being redirected to /login ? Thank you
Hi,
Please check the route. If you are using routes path from config, you can remove the auth middleware. routes/web.php
// $route->middleware('auth');
Thanks
if I remove or comment that line then i get this https://imgur.com/9Cx2jKJ
Hi,
This is a bug. We will include the fix in the next update. As workaround, please add this.
if ($user && (!method_exists($user...
in file app/Core/Adapters/Menu.php line 37
https://ibb.co/f2t7Mc6Thanks