Discussion on Metronic | Tailwind, Bootstrap, React, Next.js, Vue, Angular, Laravel Admin Dashboard HTML Template

Discussion on Metronic | Tailwind, Bootstrap, React, Next.js, Vue, Angular, Laravel Admin Dashboard HTML Template

Cart 119,772 sales
Recently Updated
Well Documented

keenthemes supports this item

Supported

This author's response time can be up to 1 business day.

12203 comments found.

Hi,

Would you consider implementing an option to disable datatable auto refresh on window resize if when can we expect it?

Thanks

Hi,

1) You could use “ng serve—port 4401” to change the port.

2) Can you check if the vendors.bundle.js and scripts.bundle.js are loaded and in the correct order?

Thanks

Hi,

vendor.bundle.js is loaded after that its main.bundle.js. Not scripts.bundle.js unless its main.bundle.js under a different name.

Hi,

In Metronic, we don’t have file name main.bundle.js. Was it your own JS file or from Metronic file?

Thanks

I have a problem with mdatatable on mobile. On scroll up/down, datatable keeps refereshing content (is with ajax). How can we disable this?

Hi, The datatable keeps refreshing because it keeps triggering resize. We will check on it and provide the fix soon. Thanks

Hello, is the version 4 still being updated?

Hi,

We will no longer update the old version. If you have any important bug report you can contact our support at support@keenthemes.

Just a friendly reminder: Seems your support subscription is expired and if you wish to get any further theme support you will need to renew your support subscription. For further check please go to Metronic purchase page http://themeforest.net/item/metronic-responsive-admin-dashboard-template/4021469?ref=keenthemes

For more info please check: https://help.market.envato.com/hc/en-us/articles/208191263-What-is-Item-Support- or http://themeforest.net/page/item_support_policy

Thanks.

I see new version is 5.2, i try to download but it’s still version 5.1.7. what should i do to get new version

Hi :),

Sorry, It took some time to get it released. Now its released and you can download it now.

Thanks.

Is there Sketch file or XD file is available for this theme.

Hi :),

Yes, please download the latest version of the theme and you will get all the available PSD and Sketch files.

Thanks.

Hi! we already have 12 different themes and 3 more are coming, what if you concentrate energies on getting all the remaining features from metronic 4 to metronic 5? creating more features will be good too! :D like Vue.js compatibility =) thanks!

Hi :),

Thanks for your suggestions. Those new demos were released due to a lot of client requests. Also in this release we have released the most awaited datatables.net integration. We will be releasing the rest of the pending features in the following updates. Also, we have serious plans for Vue and React versions as well.

Thanks.

Hi, using Metronic 4.7.5 when using datatables example table-datatables-responsive.js I tried deleting the buttons because I don’t want them but it shows an error and won’t load, error: Uncaught TypeError: Cannot read property ‘buttons’ of undefined, what can I do? Thanks!

Hi,

Please check the JS code that initializes the plugin and make sure there is no reference of the buttons extensions left.

===============

Just a friendly reminder: Seems your support subscription is expired and if you wish to get any further theme support you will need to renew your support subscription. For further check please go to Metronic purchase page http://themeforest.net/item/metronic-responsive-admin-dashboard-template/4021469?ref=keenthemes

For more info please check: https://help.market.envato.com/hc/en-us/articles/208191263-What-is-Item-Support- or http://themeforest.net/page/item_support_policy

Thanks.

Any advice for RTL?

Hi,

At the moment Metronic does not officially support the RTL version. We have plans to consider it in the near future.

Thanks.

Hello , Where RTL in new version ???

Hi,

At the moment Metronic does not officially support the RTL version. We have plans to consider it in the near future.

Thanks.

wow this is what i want, metronic and datatable. thanks for the update!

Hi :),

You are welcome. I hope you will like the new skin of the datatables plugin.

Thanks.

Anyone know how to properly get negative numbers to display on the bar charts without funky formatting?

Hi,

Our support mainly covers the theme’s original features. The issues or customization questions regarding the 3rd party plugins are not primarily covered by according to our support policy. However if you can provide more details(what plugin, which page) we will try to point you out. The best source for you is official documentations of 3rd plugins you are using.

Thanks.

How long does it take to get support on your site? I paid for extended support to get help with you product, but have not gotten a response.

Hi,

Very sorry, We will check your issue and reply you shortly. We have been super busy last 24 hours in order to release the new update.

Thanks.

Hello Support,

I’m unable to apply the default bootstrap 4 spacing classes.

i.e mt-20 which is = margin-top: 20 !important;

https://getbootstrap.com/docs/4.1/utilities/spacing/

I know you have few classes already setup in the doc section, but why we can’t use the default bootstrap helper classes?

Thanks

Hi,

Where are you trying to use those classes ? Can you provide us more details ? By right those helper classes should work as expected since Metronic does not override it at all.

Thanks.

Hello Thanks your reply.

I’m trying to setup brake-points using bootstrap default classes but it seems they are being overwritten by your css.

Just basic example where I’m trying to add margin bottom to portlet.


    <!--begin::Portlet-->
    <div class="m-portlet mb-50 m-portlet--mobile">
        <div class="m-portlet__head">
            <div class="m-portlet__head-caption">
                 <div class="m-portlet__head-title">
                     <h3 class="m-portlet__head-text">
                                    Basic Portlet
                      <small> portlet sub title </small>
                  </h3>
                 </div>
             </div>
        </div>
        <div class="m-portlet__body">
            Lorem Ipsum is ..... 
        </div>
    </div>
       <!--end::Portlet-->

Thanks

Hi,

“mb-50” does not exist in Bootstrap. Please check: https://getbootstrap.com/docs/4.1/utilities/spacing/

If you need margin helpers you can try to use Metronic ones: “m—margin-bottom-50”;

Thanks.

Hello. I see that version 5.2 came out today. However when I download the theme from Themeforest I get 5.1.7. Can you let me know when 5.2 will be available?

Hi,

Sorry, it took a while to got it released. You can try to download the new version now.

Thanks.

Great, thank you.

You are welcome :)

How much time will it take before you roll out a react js compatible version?

Hi,

We can not let you know this at the moment as we haven’t started the reactjs development yet. We are still working on the native Angular version.

Thanks.

Hi Keenthemes,

When I am doing search on datatable I am not getting the correct results For example : if i am searching anything Which is not like “ACC” then i am getting the perfect results, but when i search “ACC” it does not return the search result even if the datable column has “ACC” value.

Please reply as soon as possible.

Thanks !

Hi,

Can you reproduce it at our demo site? https://keenthemes.com/metronic/preview/?page=crud/metronic-datatable/base/data-local&demo=default

Does it only happens with word “ACC”?

Thanks

Hi ,

Yes ! Rest of other possibilities are working Fine…. Even at your demo this is not happening

Thanks

Hi,

We have to check your datatable init code, and some part of your data to reproduce this issue at our end. If possible, you can share the codes or any simple code to reproduce the issue.

Thanks

I’ve upgraded to the new version. How do I change it back so that instead of the screens blink as they load, i get the “please wait” message again? I’m sure it’s just a css class but I’m having trouble figuring it out.

Hi,

You can use the layout builder of your selected demo and enable the page loader feature. For example, for the default menu you can enable it here: http://keenthemes.com/metronic/preview/?page=builder&demo=default

And you will just need to export the HTML code.

Just a friendly reminder: Seems your support subscription is expired and if you wish to get any further theme support you will need to renew your support subscription. For further check please go to Metronic purchase page http://themeforest.net/item/metronic-responsive-admin-dashboard-template/4021469?ref=keenthemes

For more info please check: https://help.market.envato.com/hc/en-us/articles/208191263-What-is-Item-Support- or http://themeforest.net/page/item_support_policy

Thanks.

Hi all,

Do you know how to put the datepicker calendar in french ?

Best regards, Ben

Hi,

I followed your instruction by adding the different files and line code, but i am still be able to generate the french datepicker calendar after compilating the Metronic source.

Do i need to create a support request to go deeper in the analysis ?

Thanks in advance for your help :)

Ben

Hi,

It’s ok i finally resolve my problem :) thanks

Hi :),

Great. Glad to hear that. All the best with your project!

Thanks.

Hi Keenthemes,

I was able to render a JSON backend URL on frontend Metronic mdatatable, but can’t filter mdatatable by Sexe or Type of client, I used the same data-ajax.js folow the exact way you did, everything is great, except Filtering and searching on datatable, any idea ???

I repeat everything is woking wonderfully as expected, except Searching /filtering on table.

You find below my sources files : Splashscreen / HTML File / data-ajax.js My mdatatable SplashScreen : https://ibb.co/i2A9w7

Thank’s in advance.

—- my : data-ajax.js //== Class definition var DatatableRemoteAjaxDemo = function() { //== Private functions // basic demo var demo = function() { var datatable = $('.m_datatable').mDatatable({ // datasource definition data: { type: 'remote', source: { read: { method: 'GET', url: '/client/json/', map: function(raw) { // sample data mapping var dataSet = raw; if (typeof raw.data !== 'undefined') { dataSet = raw.data; } return dataSet; }, }, }, pageSize: 10, serverPaging: true, serverFiltering: true, serverSorting: true, }, // layout definition layout: { scroll: false, footer: false }, // column sorting sortable: true, pagination: true, toolbar: { // toolbar items items: { // pagination pagination: { // page size select pageSizeSelect: [10, 20, 30, 50, 100], }, }, }, search: { input: $('#generalSearch'), }, // columns definition columns: [ { field: 'pk', title: '#', sortable: false, // disable sort for this column width: 40, selector: false, textAlign: 'center', }, { field: 'nom', title: 'Nom', // sortable: 'asc', // default sort filterable: false, // disable or enable filtering width: 150, // basic templating support for column rendering, template: '{{nom}} - {{prenom}}', }, { field: 'prenom', title: 'Prenom', attr: {nowrap: 'nowrap'}, width: 150, template: function(row) { // callback function support for column rendering return row.prenom + ' - ' + row.email; }, }, { field: 'tel_mobile', title: 'Tel Mobile', width: 100, }, { field: 'date_naiss', title: 'Date Naiss', type: 'date', format: 'MM/DD/YYYY', }, { field: 'sexe', title: 'Sexe', // callback function support for column rendering template: function(row) { var status = { 1: {'title': 'Masculin', 'class': 'm-badge--brand'}, 2: {'title': 'Feminin', 'class': ' m-badge--danger'}, }; return '<span class="m-badge ' + status[row.sexe].class + ' m-badge--wide">' + status[row.sexe].title + '</span>'; }, }, { field: 'type_client', title: 'Type Client', // callback function support for column rendering template: function(row) { var status = { 1: {'title': 'Simple', 'state': 'danger'}, 2: {'title': 'Regulier', 'state': 'warning'}, 3: {'title': 'Fidele', 'state': 'primary'}, 4: {'title': 'Indesirable', 'state': 'accent'}, }; return '<span class="m-badge m-badge--' + status[row.type_client].state + ' m-badge--dot" /> <span class="m--font-bold m--font-' + status[row.type_client].state + '">' + status[row.type_client].title + '</span>'; }, }, { field: 'Actions', width: 110, title: 'Actions', sortable: false, overflow: 'visible', template: function (row, index, datatable) { var dropup = (datatable.getPageSize() - index) <= 4 ? 'dropup' : ''; return '\ <div class="dropdown ' + dropup + '">\ <a href="#" class="btn m-btn m-btn--hover-accent m-btn--icon m-btn--icon-only m-btn--pill" data-toggle="dropdown">\ <i class="la la-ellipsis-h" />\ </a>\ <div class="dropdown-menu dropdown-menu-right">\ <a class="dropdown-item" href="' + row.pk + '"><i class="la la-edit" /> Edit Details</a>\ <a class="dropdown-item" href="' + row.pk + '"><i class="la la-leaf" /> Update Status</a>\ <a class="dropdown-item" href="' + row.pk + '"><i class="la la-print" /> Generate Report</a>\ </div>\ </div>\ <a href="' + row.pk + '" class="m-portlet__nav-link btn m-btn m-btn--hover-accent m-btn--icon m-btn--icon-only m-btn--pill" title="Edit details">\ <i class="la la-edit" />\ </a>\ <a href="' + row.pk + '" class="m-portlet__nav-link btn m-btn m-btn--hover-danger m-btn--icon m-btn--icon-only m-btn--pill" title="Delete">\ <i class="la la-trash" />\ </a>\ '; }, }], }); $('#m_form_status').on('change', function() { datatable.search($(this).val(), 'Sexe'); }); $('#m_form_type').on('change', function() { datatable.search($(this).val(), 'type_client'); }); $('#m_form_status, #m_form_type').selectpicker(); }; return { // public functions init: function() { demo(); }, }; }(); jQuery(document).ready(function() { DatatableRemoteAjaxDemo.init(); });

Hi,

It seems you are using remote data source. The pagination, sorting, and filtering should be handled at your backend.

You can check our sample backend scripts that handled those process (docs/api_reference/datatablse/demos/)

Thanks

Ohhh That’s why.

sorry didn’t know,

So if I want searching filtering, I have to use JSON DATA ??

thank you.

Hi,

Yes, JSON string format is a standard format for transferring data between different system environment.

Thanks

Hey, is this theme compatible with the new angular 6 release?

Hi :),

Angular 6 is just released and we will need some time to upgrade to it. We will try to update to Angular 6 in the next release, if possible.

Thanks.

by
by
by
by
by
by

Tell us what you think!

We'd like to ask you a few questions to help improve ThemeForest.

Sure, take me to the survey