12183 comments found.
metronic_v5.3, I can’t find Bootstrap File Input
Hi,
If you are referring to the custom bootstrap inputs they are under “Custom Controls” portlet: http://keenthemes.com/metronic/preview/?page=crud/forms/controls/base&demo=default Thanks.I mean file input when Image Upload
You can check the dropzone plugin: http://keenthemes.com/metronic/preview/?page=crud/forms/widgets/dropzone&demo=default
Bug: All the dropdowns have blurry text in Google Chrome
to see it, simply remove the “transform: translate3d(-166px, 0px, 0px);” from the dropdown-menu class (after rendering)
https://www.sencha.com/forum/showthread.php?317202-transform-translate3d-causing-blurred-text-in-ChromeHi,
Seems this was a genuine of Bootstrap dropdown component. This sunday we are going to release the next update with the latest Bootstrap 4.1.2 update. Hopefully this bug will be fixed in this new update.
The 2nd issue, what device width did you encounter it ? Is it real mobile device width or you tried it in very small width by manually resizing the browser ? Just an advice, you can use Bootstrap responsive utility classes or Metronic’s helper classes to hide long texts in mobile view to make the layout more responsive.
Thanks.
testing in with screen resizing and iPhone 6. You can reproduce this by : - going to the following page: https://keenthemes.com/metronic/preview/?page=builder&demo=demo12 - click on the tab “header” - change the select Search Type: to Expanded Search - resize the browser to a mobile size. (only happends for demo 12,the default does not have this issue).
1. #”All the dropdowns have blurry text in Google Chrome” - Seems to be fixed when using Bootstrap 4.1.2, good catch and thanks for the feedback.
Great! Thanks for the update on this 
Hi i have two questions
- i want to change the click event (to reload page), when clicking on the OK button on the modal after succesfull submitting wizard-2. Where can i do this? (in default version)
-the vendors.bundle in demo8(default version) is 1 row, do you have an uncompressed version of it?
Hi,
1) In order to implement you own JS code you will need to be familiar with the build tools. The initialization script of the wizard-2 example is “src\js\demo\default\custom\crud\wizard\wizard.js”. You can get this code and reuse it in your own custom script as described in the below.
2) This is compiled and minified version of the entire 3rd party plugins. You should not directly edit the compiled js files. Instead please refer to the documentation and learn how to use the build tools. Basically you can edit the JS files in the source “src” folder the compile theme into assets folder. To customize the theme styles you can edit the sass files. For more info please refer to the documentation – http://keenthemes.com/metronic/documentation.html. If you a beginner in such build tools, I would suggest you to get started with it and you will see how the development will go more smooth and efficient.
3) You can add 2 types of JS script. Custom – included for a specific page or Global – included for all pages globally. To add a custom script you can create a file in the source folder: “src\js\app\custom\my-script.js” and add your code and compile the theme. You will get the compiled(minified) version of your scripts under “assets/”.
Thanks.
Hi,
Is there any way to export to PDF file the datatable.net in angular 5 version ?
Hi ,
Is it work in Metronic Datatable ?
Hi,
Currently, Metronic Datatable does not support export to PDF yet
Thanks
Hi,
I am thinking about using the Metronic theme for my new Angular application. Is Metronic compatible with Angular 6.1? It is a requirement for me.
Best regards,
Hi ,
We will be releasing it with the latest Angular 6.1 update within the next week.
Thanks.
That’s great! I’ll use it so
Thank you for your quick anwser.
You are welcome
How to use the code， Is there any documents？I use it in springboot project
Hi
Thanks
Thanks and can it be used in a SpringBoot project?
And I got error as below: E:\metronic_v5.3\metronic_v5.3\angular\dist\demo\default>ng serve Your global Angular CLI version (6.1.0) is greater than your local version (1.7.4). The local Angular CLI version is used.
To disable this warning use “ng config -g cli.warnings.versionMismatch false”. Cannot read property ‘write’ of undefined TypeError: Cannot read property ‘write’ of undefined at UI.write (E:\metronic_v5.3\metronic_v5.3\angular\dist\demo\default\node_m odules\@angular\cli\ember-cli\lib\ui\index.js:56:23) at UI.writeLine (E:\metronic_v5.3\metronic_v5.3\angular\dist\demo\default\no de_modules\@angular\cli\ember-cli\lib\ui\index.js:69:8) at Class.run (E:\metronic_v5.3\metronic_v5.3\angular\dist\demo\default\node_ modules\@angular\cli\tasks\serve.js:237:12) at check_port_1.checkPort.then.port (E:\metronic_v5.3\metronic_v5.3\angular\ dist\demo\default\node_modules\@angular\cli\commands\serve.js:123:26) at <anonymous> at process._tickCallback (internal/process/next_tick.js:188:7)
Hi,
Sorry, we have no official support to SpringBoot project. The error caused by angular-cli version mismatched. The current Angular project version is 5. Your angular-cli version is for Angular 6.
FYI, we are releasing native Angular v6.1 soon.
Thanks
I see that the Angular version is supposed to be released this week. Do you know what day? We are struggling to use your template as of now with Angular. Lots of errors and issues with speed.
Hi ,
We are planning to release it within the next week. Stay tuned!
Thanks.
Hello,
I have been watching this theme for quite a while now in order to purchase the angular 6 version for a new project. Metronic seems ideal for the project but if it won’t be released any time soon then I would have to purchase another angular 6 theme to get started. Do you guys have a release date planned as yet?
Regards.
Hi ,
It will be released really within the next week. We are working final testing and documentation preparation. All major issues are fixed for all major browsers. Our release was delayed due to the IE11 performance issues. Now we are ready for release.
Thanks.
Ok I guess I can wait a little longer. Great job on the theme by the way!
Hi ,
We are planning to release it within the next week. Stay tuned!
Thanks.
Hello,
Three months ago you mentioned you’d be releasing a React version soon. I’m going to be starting a new project in the next few weeks or so and was wondering if your React version will be released by then.
Best, -jrgochan
Hi
We are sorry. The React version would not be released within next few weeks. At the moment, we are heavily working on Angular 6 big updates.
Thanks
Sounds good. Thank you for the update!
how to create blank or startup angular project with very clear steps?
Hi
In our existing Angular we do have the skeleton project, which is blank but with the Metronic theme’s integrated.
You can check it in /dist/skeleton/demo/[demo_name] folder.
You have to run “npm install” and “ng serve” at the root of Angular project to run it.
Thanks
I’m also waiting for Demo 14
Hi ,
Thanks for your feedback. It will be out soon once we release some major planned updates soon. Stay tuned!
Thanks.
I see you said Demo 14 was coming out in a few weeks, over a month ago. Any update on that?
Hi ,
Thanks for your feedback. It will be out soon once we release some major planned updates soon. Stay tuned!
Thanks.
Hey, when is the Angular 6 version coming out ? Any specific date ?
Hi ,
We can not give you the exact date. This Angular 6 update is so complex and especially it gives us a lot of trouble. We will need to release stable and complete solution that works on all major browsers. Angular 6 has so many unpredicted challenges that you can not oversee until you face it. That’s why we are a bit late with the release. But we are really close to the release and we would like to fully focus on the development. We hope for your understanding.
Thanks.
Hi. When will the Angular 6 version be released? Any luck for this week?
Hi ,
We can not give you the exact date. This Angular 6 update is so complex and especially it gives us a lot of trouble. We will need to release stable and complete solution that works on all major browsers. Angular 6 has so many unpredicted challenges that you can not oversee until you face it. That’s why we are a bit late with the release. But we are really close to the release and we would like to fully focus on the development. We hope for your understanding.
Thanks.
can I take a look at the code before purchasing it? I’m interested in metronic 5 the one with Angular-CLI. I have read a review where its mentioned its just a wrapper not pure Angular. I need to figure out whether I can fit it into my Angular application.
Hi sheikhsohaib07 ,
Yes, the existing Angular is Angular 5 and a wrapped version of HTML+jQuery. But, we are releasing native Angular 6 soon. You can buy first to test and if you are not happy with our product, you can ask for a refund.
Thanks
How long will it take for native angular6? Can you specify number of days?
Hi ,
We can not give you the exact date. This Angular 6 update is so complex and especially it gives us a lot of trouble. We will need to release stable and complete solution that works on all major browsers. Angular 6 has so many unpredicted challenges that you can not oversee until you face it. That’s why we are a bit late with the release. But we are really close to the release and we would like to fully focus on the development. We hope for your understanding.
Thanks.
Great, can you give me any rough idea? Like less than a month, withing 3 to 6 months or within this year? Thanks.
Hi ,
We are planning to release it within the next week. We are really close!
Thanks.
Awesome
Hi Keenthemes,
Do you have any collapse toggle portlet which doesnt have < a href = ”” > in it , as we are using angularjs 1.6.4 it is conflicting with angularjs routing services ..
Thanks !
Hi,
Integrating Metronic 5(jQuery + HTML) is with the old AngularJS is quite time consuming task as we went through this a few years ago. Our support do not cover the new Metronic version integration issues with old AngularJS since it takes more time that we can allow per support request. Also we do not sell the new Metronic 5 + AngularJS1.3 implemented version that we have to provide official support. I would suggest you to use the new fully native Angular 6 version that will be released soon. As Angular 1.x integration will have a lot of hidden issues that you will need to solve one by one as you go. Also we do not provide end to end support for integrating the new Metronic 5 version with old Angular 1.3. This is not covered by our support policy: https://themeforest.net/item/metronic-responsive-admin-dashboard-template/4021469/supportThanks.
I’m really impressed with most of the product but I’m pulling my hair out in frustrating because of your file-system setup. It’s all over the place.
Check out the demo6 folder – I’m getting constant issues with the way that you’ve hard-coded in the directory names to the point where it’s absolutely ridiculous that I’ve spent the last 2 days debugging issues with this only to find that it’s because of the weird way that the file system has been put together.
Is this just a temporary bug or can I expect to have to re-vamp the entire file-system every time that I upgrade?
EG:
http://localhost:4200/inc/api/datatables/demos/default.php 404 (Not Found)There isn’t even a folder named “demos”, it’s called “demo”
Likewise you’ve split the logos media folder into “logos” and “logo” depending on which demo is used.
This is obviously not something that I expect to run into in a product that has as many sales and as many opportunities to fix up the versioning as this one.
I’d love an update on plans to address this.
Hi,
Thanks for your feedback.
1) Angular does not allow to read files from any directory. the file must be access via full url. we have “gulp apiurl” command to convert the relative path to full api url. We have to do so in order to simulate the backend responses for Angular version. Please check the documentation and refer to the API demo section where you will need to change API URL using gulp task according to your project web folder.
2) Please note, the file paths are best fit for your multi demo structure and you can change it further according to your requirements. In Metronic each demo is considered as a unique layout with its own assets, media files and at the same time each demo shares the global components and plugins.
3) Yes, we have some plans to improve the file structures in a future releases. However current file structure is quite optimal and most of the developers are using it without any issues.
If you need any further clarifications please let us know.
Thanks.
Hello, I got a problem. While using the Metronic Wizard in my asp.net application. It’s a master/detail page and the”form” tag is in the master page. I don’t know why but while I press the save & continue button it doesn’t go to the next step. Not sure if I need to change something in your wizard.js. Can you help? Thank you!
I found the error cause by I remove the search bar from the Horizontal Menu. But why the wizard can’t function without the search bar? My workaround now is to set display:none.
Another quick question: how can I make the check box twice large?
Hi,
May I know which check are you referring to ? If you are working with the form checkboxes then it does not support sizing. You will need to override its css code to enlarge it. Do you need to enlarge it globally or for only special use ?
Thanks.
Hi keenthemes.
Does anyone recently reports about your M-datatable HTML version rendering problems ???
I’m having some. I’m using Metronic 5.3
I have 10
something wrong in your .js ???
Let me know if you already know about it by smeone .??
Thank you.
Hi,
Could you please send us the screenshot? And how did you reproduce it?
Thanks
I used the regular DataTables insted and it is working like a charme, that the reason why I droped the Metronic Datable, but if it is gonna work on Metronic Datables I really would like to you Metronic Datatables, it is Styling much better that regular DataTables specially filtering by select.
give me a moment to set up screenchots and sources ..
thank you
Hi Keentheme again, here’s how I rendered / reproduce the whole thing :
here my Django Template HTM Rendrering portion, took it from mDataTable html source to DataTables htm source, everything works fine :
<table class="m-datatable" id="html_table" width="100%">
<thead>
<tr>
<th title="Field #1">#</th>
<th title="Field #2">Type Véhicule</th>
<th title="Field #3">Logo</th>
<th title="Field #4">Véhicule</th>
<th title="Field #5">Matricule</th>
<th title="Field #6">Assurance</th>
<th title="Field #7">C. Technique</th>
<th title="Field #8">Vignette</th>
<th title="Field #9">Agence</th>
<th title="Field #10">Status. V</th>
</tr>
</thead>
<tbody>
{% for obj in vehicule_list %}
<tr>
<td>{{ obj.pk }}</td>
<td>{{ obj.type_vehicule }}</td>
<td>{{ obj.logo }}</td>
<td>{{ obj.marque }}- {{ obj.modele }} - {{ obj.version }}</td>
<td>{{ obj.immatriculation }} - </td>
<td>{{ obj.get_assurance_courante }}</td>
<td>{{ obj.get_controle_technique_courante }}</td>
<td>{{ obj.get_vignette_courante }}</td>
<td>{{ obj.agence }}</td>
<td>{{ obj.status_vehicule }}</td>
</tr>
{% endfor %}
</tbody>
</table>
Here's the datatables rendering fine :https://ibb.co/gEAVKJ
Now for the Metronic datatable :https://ibb.co/htXczJ
<blockquote> To be more sure that I will get the rendering the same, I Used the same number of fields that you did Used in your Metronic HTM Datatables, wich is 10 fileds. </blockquote> For the Metronic "html-table.js" I didn't touch it, I wanted once it render the strings that I'm looking for, I'm gonna customise the classes of "Status" and "Type" I also planned once it render I'm gonna add a Actions list button at the end of the fields table. As you can see No rendering for "C. Technique" and "Status. V" fields, BUT, BUT, If I move the Django rendering <tr> of those 2 before "Assurance" filed they display the Data according to its fields. and another field will disapear, so I say that I has to do between "Assurance" and "C. Technique" field. I realy wants to use Metronic DataTables for its amazing design. and Filtering using Selects. I want to use Filtering for "Agence" and "Status. V" like you did for "Status" and "Type" one I got everything rendering. Thank you Keenthemes.</tr>
Hi, riterix
We can’t open your screenshot links. It saying “That page doesn’t exist”. Could you please resend?
Thanks
first link with datatables and it is working just fine : https://ibb.co/gEAVKJ
second link working with Metronic datatables wich I’m facing some kind of issue you find screenshot below : https://ibb.co/htXczJ
If you need any further informations please don’t hesitate and get back to us.
Thank you keenthemes.
Hi
Can you please confirm that your C.Technique key is “get_controle_technique_courante” and Status.V is “status_vehicule”
From our perspective here, we do not know about your “obj” variable. Can you please try to dump all the data in the “obj”? And check if the key is correct?
Also, if the data exist, what is the data that should be displayed? Was it a string or object in it? Can you send some rows of your data for us to test?
Thanks
Thanks for the reply :
1- The Data indeed exist. 2 – The Data displayed is Strings. 3 – What do you mean by send us some rows ??? I already gave you the screenshots viewing the all Data in the first image of datatables, it render all the data fine. but when I switch to mDatatable C. technique and status are not shown .
I think something wrong in the .js
Thank you
Hi,
Yes, we need more info for us to simulate the issue on our end, so we can check it, fix it (if it is a bug) or provide you with the solution.
We would like to know the content of your html-table.js. Did you defined “Vignette” or “Status. V” in the columns option?
Thanks
No I didn’t define “Vignette” or “Status. V” in html-table.js,
I left it as it is, I told myself once it will render fine I’m gonna take care of the customization of the Filtering options like “Agence” and “Status. V”. but it didn’t render all the field, I know that it has to do with html-table.js !
Do we have to define those 2 filed inside the html-table.js, in order to everything works fine as expected ??
thank you.
I also confirm that your C.Technique key is “get_controle_technique_courante” and Status.V is “status_vehicule”
Hey Keenthemes,
I think it is a bug.
Here what I did to know that :
I start with everything as default untouched, so Obviously it is rendering fine.
what I did , is a loop to iterate through my object but instead of inserting my own variable I left the same line (your static
<table class="m-datatable" id="html_table" width="100%">
<thead>
<tr>
<th title="Field #1">Order ID</th>
<th title="Field #2">Owner</th>
<th title="Field #3">Contact</th>
<th title="Field #4">Car Make</th>
<th title="Field #5">Car Model</th>
<th title="Field #6">Color</th>
<th title="Field #7">Deposit Paid</th>
<th title="Field #8">Order Date</th>
<th title="Field #9">Status</th>
<th title="Field #10">Type</th>
</tr>
</thead>
<tbody>
{% for obj in vehicule_list %}
<tr>
<td>57520-0405</td>
<td>Sunny Garton</td>
<td>(288) 1417941</td>
<td>GMC</td>
<td>Savana 2500</td>
<td>Yellow</td>
<td>$99799.94</td>
<td>2016-03-23</td>
<td>5</td>
<td>2</td>
</tr>
{% endfor %}
</tbody>
</table>
Did you see the
{% for obj in vehicule_list %}
<tr>
<td>{{ obj.pk }}</td>
<td>{{ obj.type_vehicule }}</td>
<td>{{ obj.logo }} - TODO -</td>
<td>{{ obj.marque }}- {{ obj.modele }} - {{ obj.version }}</td>
<td>{{ obj.immatriculation }} - {{ obj.status_vehicule.pk }} - {{ obj.status_vehicule }}</td>
<td>{{ obj.get_assurance_courante }}</td>
<td>{{ obj.get_controle_technique_courante }}</td>
<td>{{ obj.get_vignette_courante }}</td>
<td>5</td>
<td>2</td>
</tr>
{% endfor %}
<code>
it render wonderfully.
but with static "Status" and "Type", did you see their correspondant <td>. </td><td>5</td> and <td>2</td>
**********
*********
*********
Now the moment of the truth, If I'm gonna insert the "Status" and "Type" variable, but this time dynamiclly. like this :
<code>
{% for obj in vehicule_list %}
<tr>
<td>{{ obj.pk }}</td>
<td>{{ obj.type_vehicule }}</td>
<td>{{ obj.logo }} - TODO -</td>
<td>{{ obj.marque }}- {{ obj.modele }} - {{ obj.version }}</td>
<td>{{ obj.immatriculation }} - {{ obj.status_vehicule.pk }} - {{ obj.status_vehicule }}</td>
<td>{{ obj.get_assurance_courante }}</td>
<td>{{ obj.get_controle_technique_courante }}</td>
<td>{{ obj.get_vignette_courante }}</td>
<td>{{ obj.agence.pk }}</td>
<td>{{ obj.status_vehicule.pk }}</td>
</tr>
{% endfor %}
<code>
It will not work, and stays at the message :"Please wait..." with the spining wheel. Not working.
You have also to know that my 2 variable : {{ obj.agence.pk }} and {{ obj.status_vehicule.pk }} render only a small numbers like 1, 3, 9, 5 ..., wich is the same variable type as your static ones "Status" and "Type", with datatables.net if I do inspect elements, it shows numbers like : <td>3</td> for "Status" and <td>1</td> for "Type".
PS : 1- I didn't touch the .js file. 2- I used your own whole <th> and stuff, 3 - in conclusion I just modifiying the </th><td> portion make it a loop for. but with no luck.
Thank you keenthemes.
</td></code></code></code>
Hi,
Okay, we understood your issue.
At the time “stays at the message :”Please wait…” with the spinning wheel”, can you check your browser’s console.log? If there is any JS error?
If you are reusing our datatable init JS file, have you tried to remove all the columns in option?
Thanks
Thank you for the reply :
What do you mean by columns in option, those “Status and Type” and if yes where to remove theme, in HTML or html.js file ?
Hi,
Appreciate if you could give us your datatable init JS file and easy for us to check. Based on your reply, you are reusing all things from our sample js without touching anything in the options. Then we just assume, there is js code that caused the errors because of your data is different from ours.
Eg. “Status” and “Type” field in our datatable init js options, there is a “template” option that read our data object.
We assume, status[row.Status].class caused the error. If you don’t remove it.
The datatable init js file should be customized based on your data. For HTML table, you can remove the “columns” from datatable options. By right, all the columns from HTML table should be displayed.
Btw, have you checked the browser’s console log?
Thanks
Hi PixelDots,
- I GOT IT Working *
Here’s the thing, it is amazing. It took me 3 days.
so in your html.js you have this : for status :
var status = {
1: {'title': 'Online', 'state': 'danger'},
2: {'title': 'Retail', 'state': 'primary'},
3: {'title': 'Direct', 'state': 'accent'},
};
and I have my dynamic status variable inside my loop like this :
{% for obj in vehicule_list %}
<tr>
<td>57520-0405</td>
<td>Sunny Garton</td>
<td>(288) 1417941</td>
<td>GMC</td>
<td>Savana 2500</td>
<td>Yellow</td>
<td>$99799.94</td>
<td>2016-03-23</td>
<td>2</td>
<td>{{ obj.status_vehicule.pk }}</td>
</tr>
{% endfor %}
It didn’t render because of the number generated by my dynamic variable {{ obj.status_vehicule.pk }} , why because sometimes my variable gerate a number out of your list of case, ex : imagine that my {{ obj.status_vehicule.pk }} will generate a number 5, well it can’t be assigned in your status list case, becasue you just got 3 case :
1: {'title': 'Online', 'state': 'danger'},
2: {'title': 'Retail', 'state': 'primary'},
3: {'title': 'Direct', 'state': 'accent'},
that’s why It keep spinning and can’t assigner undefined number.
Now my question could you change your Status and Type .js so it can give a default value if the td {ex: 9} /td is out of your lit case ? that would be a huuuuuuuuuge plus for us.
I’m so happy that I could use Metronic datatable.
Thank you Pixeldots for beeing passion.
let me know about the script change option if it is possible before the next coming release because we want to start from scratch using that next release.
thank you
Hi riterix,
There should be no changes to the sample datatable initialization (eg. base/html.js) for the next release. It is not a core datatable plugin which has a bug, but it is just a sample on how to initialize the datatable.
You can take the sample js code as a reference, but the datatable options should be based on your datatable requrements, data source, columns, etc.
The core datatable plugin is in datatable.js or bundled in scripts.bundle.js. If there is a bug to the core datatable plugin, we will fix it.
Thanks
Allright.
Thank you PixelDots and sorry for the husstle..
Your welcome. Feel free to ask if you need help with the theme. All the best!
Hi, if I buy the theme I have both Angular and Html theme? I can use first html and when will be pubblished Angular 6 version this new angular version? Thank you.
Hi,
Native Angular version of Metronic will be published very soon. We are on final stage.
Thank you.
This item was featured on ThemeForest
Power Elite Author
Contact the Envato Market Help Team
