Holiday Notice: Support will be provided on a limited scale from December 24th, 2024, to January 2nd, 2025. Happy holidays and a wonderful New Year!


Topic: bsCustomFileInput is not defined

endeehjeeh pro asked 5 years ago


*Expected behavior*Package exists and is included in mdb.min.js

*Actual behavior*ReferenceError: bsCustomFileInput is not defined\ mdb.js:27388 js mdb.js:27388

Resources (screenshots, code snippets etc.)


Piotr Glejzer staff commented 5 years ago

Hello, where do you have this error?


endeehjeeh pro commented 5 years ago

When i'm calling mdb.js or mdb.min.js within the page as last js script before initializing my own js-stuff. Do i have to include bsCustomFileInput inside webpack-config by myself or is it a package i need to install?


Piotr Glejzer staff commented 5 years ago

you can try including it but it should be in our packages.


endeehjeeh pro commented 5 years ago

Does not work. When i'm including mdb.js in my app.js with require-statement and let building it with symfony webapck, it's not working. When i'm calling it separately as js-file inside my HTML it is working. Nothing worked, so i commented bsCustomFileInput.init() out at the end of mdb.js.


Piotr Glejzer staff commented 5 years ago

you can go to mdb.js or to bs-custom-file-input and remove that part and it will work without it. And you can try to initiate that plugin in some main js file after webpack bundling your files


dev_methameasure free commented 5 years ago

I fixed this by writing bsCustomFileInput = require('bs-custom-file-input'); in my bootstrap.js file. I'm using Laravel though if that makes a difference.


MDBootstrap staff commented 5 years ago

Hi, thank you for your valuable information about that behaviour of our package. We will investigate the cause of it. If any problem occurs from using our package, please let us know. Best regard, Piotr


xmenus free commented 5 years ago

This problem still going on. Importing it in a vuejs project and the error is still there. Any plan to fix this?


MDBootstrap staff commented 5 years ago

I pass this information to the vue development team. Thank you for contribution. The previous issue is on our to-do list but right now we need to wait for someone to take care of it.


coooller@gmail.com free commented 5 years ago

Using webpack encore in symfony 4. I added:

import bsCustomFileInput from 'bs-custom-file-input';

global.bsCustomFileInput = bsCustomFileInput;

in app.js and error is gone, but not tested custom files input yet, don't know if it works.


Mikołaj Smoleński staff commented 5 years ago

Thanks for your answer. It might be helpful for us.


Michael Taylor free commented 5 years ago

I've had the same issues using webpack and laravel. Adding toastr = require('toastr.js'); to bootstrap.js worked for me


Tenarius free commented 5 years ago

You have to write your js-script-link at the head of your html-document, because bsCustomFileInput must be loaded before.


Julien Moulin free commented 5 years ago

I have the same issue with MDB 4.8.9 (JQuery) with Webpack and Laravel 5.8. I fixed this with this code in my bootstrap.js

[ import ...]

require('bootstrap');
(window as any).bsCustomFileInput = require('mdbootstrap-pro/js/modules/vendor/bs-custom-file-input');
require('mdbootstrap-pro');
[others requires ...]

Regards


Piotr Glejzer staff commented 5 years ago

Thanks for this answer. Have a nice day.


FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Closed

Specification of the issue

  • ForumUser: Pro
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: 4.8.0
  • Device: Mac
  • Browser: Firefox
  • OS: macOS
  • Provided sample code: No
  • Provided link: No