Get 2024 Templates Mega Bundle!$1000 worth of 19 Bootstrap HTML, Vue & React Templates + 3 Vector Sets for just $99
Get for 99$

Axios


Hi,

I try to implement login with django and axios.

So i use handleSubmitAjax() in \assets\js\custom\authentication\sign-in and i have the error :

ReferenceError: axios is not defined

And i add in signing.html to no longer have an error : <script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.21.1/axios.min.js"></script>

It works but it's not clean, normally it should work without it.
What should I modify?

Regards


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (14)


Sure, thank you.



Hi happy

In the file /starterkit/_keenthemes/tools/gulp.config.js

You can update the config path here to point to your custom js folder:
<img src="https://i.ibb.co/g3ZB8YX/image.png" alt="image" border="0">

Thanks



Hi,
thank you.

At the end, i need to check if you have done modifications on this file or not.
So, i chose to keep custom and rename your original file general.kt.

regards



Hi

This is one of the suggestions to isolate your custom code from Metronic updates. Assuming you are using gulp to build the assets.

You can rename the folder: starterkit/_keenthemes/src/js/custom
to starterkit/_keenthemes/src/js/my-custom

The assets will generate a new folder in: starterkit/assets/js/my-custom

So your changes should be in js/my-custom folder. Future Metronic updates will replace js/custom and not your custom code.

Thanks



Excuse me but it don't work. js/my-custom folder is not compil by gulp :/

regards



Hi,

Sorry, my mistake. Wrong framework. We did try with the latest Django. The Axios is working fine.

From the downloaded, I tried to change this to test.
<img src="https://i.ibb.co/ZBpCB1J/image.png" alt="image" border="0">

The sample Axios code is in the starterkit/_keenthemes/src/js/custom/authentication/sign-in/general.js
<img src="https://i.ibb.co/Jp1Fv87/image.png" alt="image" border="0">

Thanks



Hi,

yes that's it.

On the other hand, i have always the question : How to do custom js without been erase by update ?

Regards



For each update, you can replace all core assets into starterkit/resources/_keenthemes/src/

You can put custom JS code under starterkit/resources/mix/custom/.

The JS files here will override the core JS files from starterkit/resources/_keenthemes/src/js/custom/

Thanks



Hi,

I'm sorry but this tree does not exist.

In django_demo1, there is no resources and mix directory :/

Regards



Hi,

I tried typing axios on the login page. The plugin object is there.

<img src="https://i.ibb.co/2YqhBQk/image.png" alt="image" border="0">

Could you please try to edit this file? This is the location where the custom JS files are located.
starterkit/resources/mix/custom/authentication/sign-in/general.js

starterkit/resources/_keenthemes/src folder will be replaced when a new update is released.

Thanks



Hi,

You use the starterkit ? because i don't have the mix directory !?

Here is my screen :
<img> https://www.lenclosdesvins.com/wp-content/uploads/2023/02/signin.jpg </img>

And axios is not loaded.

PS : there is an other problem :
.. \starterkit\_keenthemes\src\js\custom\authentication\sign-in\general.js : path to the source
..\starterkit\assets\js\custom\authentication\sign-in\general.js : path to custom.

Or when a modify custom, if a do : npm run build. Custom file is erase by source file.
Does this mean that if you update I will lose all my changes?

Regards



Hi, i do the test !

With gulp it's ok, axios is added but not with npm.

On the other hand, i have always the question : How to do custom js without been erase by update ?

Regards



Hi,

axios plugin is already included in the assets bundle. May I know which Metronic version you are using?

Have you tried to recompile the assets using gulp?
https://preview.keenthemes.com/django/metronic/docs/getting-started#build-assets

Thanks



Hi,

I agree with you, it should work...

I use : metronic_django_v8.1.6_demo1 / starterkit

i recompile the assets using npm ?The error comes from here ?

Regards


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(