590 comments found.
Hi there, my name is Joao and my company has recently bought your template.
We’re trying to use TomSelect component that is a 3rd party lib and we’re wondering if we can have some support with it. We’ve read their documentation and couldn’t reproduce a way to have the placeholder inherit on the form, instead what it does, it shows the placeholder inside the multi select.
Is there any way to put a place holder on the multiselect?
Thank you.
Regards, Joao Ribeiro
Hi,
Thank you for reaching out to us,
Sorry, but I’m not sure I fully understand your question, can you send an example on the documentation or reference link we can check?
Sure, if you do the following you’ll see what I’m referring to
1. go to https://rubick-vue.left4code.com/tom-select 2. clean multiple select
You’ll see that there’s no place holder and no easy way of applying border-danger when the input is not filled.
Basically, we’re trying to figure a way to set the place holder when there’s no option selected and when the form is post to show the border-danger on it.
Thank you
Hi,
Thank you for your reply,
We enable the `dropdown_input` plugin by default so the placeholder does not appear in the input form but appears in the search input in the dropdown list. Here’s a quick solution to change it, please open this file `/src/global-components/tom-select/Main.vue` and comment or remove this line.
https://i.imgur.com/zQOSDVu.pngFor the `border` issue you might need to redownload the source code and replace this file `/src/assets/css/components/_tom-select.css` with the latest update, we released an update for this issue a while ago, thanks.
Hi Left4code. How to make a selected value in tom select component.
Hi,
Thank you for reaching out to us,
You can use `ref` reactive state and set the value from there, please check the following links. https://i.imgur.com/ZyZu6k4.png https://i.imgur.com/oyAlXeF.pngWe are getting the Warnings as given below how can we solve this.
“warn – As of Tailwind CSS v3.0, `warmGray` has been renamed to `stone`.” “warn – As of Tailwind CSS v2.2, `lightBlue` has been renamed to `sky`.”
There is total 18 warnings.
Hi,
We have made an update for this,
You may need to check these files.- tailwind.config.js
https://i.imgur.com/GTkbsWr.png
- /src/utils/color.js
https://i.imgur.com/EXBwpRH.png
I’m using it in nuxt 3, but the doppdown function doesn’t work properly. It is always shown, not hidden. I tried to look in the file global-component dropdown and tried to fix but couldn’t
Hi there,
Thank you for reaching out to us,
Unfortunately, this type of request is beyond the scope we can support. If you’d like to work with someone closer to helping you through your setup with Nuxtjs, you might consider working with a freelancer or one of the Envato Studio providers.
Hi, how can i define processQueue callback for dropzone
Hi,
Thank you for reaching out,
You can call `processQueue` from the dropzone instance, please check this link. https://i.imgur.com/xKTyApX.pngHelo, where I can download the template for Vue 2?
Can you send to my email? here is my email ferry.stephanus.s@gmail.com Thanks!
Hi,
Sorry for the late reply,
Email sent, kindly check the attached file.
hi Left4code, how to get selected index on Accordion components? i try set selectedIndex and call change event on AccordionGroup but not working.
Hi,
Thank you for reaching out,
You can use `@change` event, please check this link.https://i.imgur.com/QWTAm2x.png
https://i.imgur.com/syYg9Sh.png
thanks for help!
You’re welcome.. 
On the Top Menu when user click on the link page will be changed but menu is still open. How can we dismiss the dropdown after the click on the link?
Hi there,
Thank you for reaching out to us,
Please download the latest update and replace the `dropdown` component at the following path `/src/global-components/dropdown`. Switching between pages will now automatically hide the dropdown component.
In the new update you added the `vue-router` but we are using the intertia js so we do not need that package what should we do?
Can anyone able to give any updates on this?
Hi,
We have an update for this, please check the latest dropdown component update.
We are facing issue on the “top-menu” you can check https://enigma-vue.left4code.com/top-menu/wizard-layout-1
When user click on the any on the item on the top menu menu is still showing insted of the hides the menu.
This is actually the expected behavior, we’re just using pure CSS to show the submenu on mouseover.
hi Left4code, do you intend to make the details display the content of the inbox components?
Hi quocdat254,
Thank you for reaching out,
Yes, we can add it to the roadmap.. 
How can I fix the problem in the video? when i click ‘router.push(‘login’)’ is running https://rb.gy/c8buki
Hi,
You can do something like this. https://i.imgur.com/HVZ0ZqQ.png https://i.imgur.com/Dz1db1B.pngPlease check the dropdown page to check more API.
I can’t access the images you sent
Please use another browser or incognito mode.
Hi,
ClassicEditor lists are not working by default as list styling is nulled:
ol, ul, menu { list-style: none; margin: 0; padding: 0; }
also it seems like TomSelect component needs much work till functional…
Hi,
Thanks for reaching out to us,
Please add this code somewhere in ”/src/assets/css/components/_ckeditor.css”.
.ck .ck .ck-content {
blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
figure,
p,
pre {
margin: revert;
}
ol,
ul {
list-style: revert;
margin: revert;
padding: revert;
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-size: revert;
font-weight: revert;
}
img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
display: revert;
vertical-align: revert;
}
}
What problems are you having with Tom-Select component?
I already made this work, but I had to hack into your component to achieve some functionality that the original tom-select library provides. I wouldn’t know where to start about the problems I had…
Anyway, it was just a recommendation about giving a more clean interface to interact with this TomSelect component, not really angry about that or anything alike.
Thank you for your fast responses.
Well that’s good, however we can’t made any improvements without spesific problems/issues.
Let me know if you have any further question.
Hi, how can I order dropdown to hide options after selecting one of the option?
http://tinker-vue.left4code.com/dropdown Let’s say that we will gonna take the first example from this page and i want to close dropdown when i select “New dropdown” option. I can’t find any information how to do it
Hi web24_pl,
Thank you for reaching out to us,
You can use programmatic API or simply use `dismiss` slot function. Please check this link.
https://i.imgur.com/uNUXy3c.pngHi Team,
How can i set minDate for endDate after choose startDate and set display in dropdown year +543 in Litepicker.
Ex. 2022—> 2565
Thank you.
Hi,
Thank you for reaching out,
You can set the ‘maxYear’ to the Litepicker config. Please check this link.
https://i.imgur.com/IKvJTcn.pngHI,
How can i set minDate for endDate after startDate onChange.
Hi,
Sorry for the late reply,
Please re-download the latest version and replace this file ”/src/global-components/litepicker”.
Now, you can get the reference to the Litepicker initialization and set the new options. Please check the link below for more details.
// Attach reference key
https://i.imgur.com/VbDVQgB.png
// Detect changes & set new options
https://i.imgur.com/V9v40t7.png
You can check all of the options and methods in the following link.
https://litepicker.com/docs/options
https://litepicker.com/docs/methods
It’s work, thanks for help.
You’re welcome.. 
Hi Left4code team . We’ve been trying to integrate this VueJS product into Laravel9 . Could you please help us out with the correct steps to follow to integrate it ? Email : afinrin17[at]gmail.com
Hi,
Thank you for reaching out,
We just sent an example integration, you can check the config and everything to get the project running with Laravel.
`Hi Left4code Team , Thank you for your response . I ran `composer update` and `npm install` on your given project and received this error when npm run dev . ``` C:\laragon\www\tinker>npm run dev
> dev > vite
Could not read configuration from PHP. SyntaxError: Unexpected token W in JSON at position 1 at JSON.parse (<anonymous>) at getConfigurationFromArtisan (C:\laragon\www\tinker\node_modules\laravel-vite\dist\index.js:336:17) at defineConfig (C:\laragon\www\tinker\node_modules\laravel-vite\dist\index.js:350:68) at Object.<anonymous> (C:\laragon\www\tinker\vite.config.js:31:64) at Module._compile (node:internal/modules/cjs/loader:1099:14) at Object.require.extensions.<computed> [as .js] (C:\laragon\www\tinker\node_modules\vite\dist\node\chunks\dep-59dc6e00.js:61924:20) at Module.load (node:internal/modules/cjs/loader:975:32) at Function.Module._load (node:internal/modules/cjs/loader:822:12) at Module.require (node:internal/modules/cjs/loader:999:19) at require (node:internal/modules/cjs/helpers:102:18)
vite v2.9.9 dev server running at:
> Local: http://localhost:3000/
> Network: use `--host` to expose
ready in 1448ms.
(!) Could not auto-determine entry point from rollupOptions or html files and there are no explicit optimizeDeps.include patterns. Skipping dependency pre-bundling. ```
Can you try to run `composer dump-autoload`?
worked , but may I know why I can’t navigate others view unless , i went to dashboard first , then click on side menu , any idea how to fix this ?
Can you send step-by-step to reproduce the issue?
vue-router default ’/’ path is to dashboard-1 view so
Step 1 : go to localhost:8000/ which showing dashboard view Step 2 : manually type on url link from localhost:8000/ to localhost:8000/inbox Step 3 : 404 NOT FOUND page showing
any manually typed page like localhost:8000/file-manager would show 404 NOT FOUND page , those page can only be accessed when localhost:8000/ (dashboard url ) and click to side menu only
Please check this link.
https://laracasts.com/discuss/channels/vue/vue-router-laravel-routesis there a way to set the side menu element as active manually from other component? I have 3 pages to manage news (List, Add and Edit news) and in side menu there is only a link to List page. I would like to mark this item as active in side menu when i’m visiting Add and Edit pages as well.
Hi web24_pl,
Thank you for reaching out to us,
What version are you currently using?
It’s Tinker v3.0.6 (vue3)
You can use `inject(“forceActiveMenu”)(“page-name”)` to force active menu like below.
https://i.imgur.com/azTrADl.pngIt worked
thanks!
Glad to help.. 
Hi Left4code, please check this
It seems like you haven’t added some classes in the layout component. Please check this link.
https://i.imgur.com/OURUPwc.pngit’s work, thank you 
Have you checked our demo from the download package? Seems to be working normally.
https://i.imgur.com/uTAnEma.pngHi Left4code, you can update Tabulator to 5.x.x of Tinker version? I try but dont work.
Hi quocdat254,
Sorry for the late reply,
Sure, we can upgrade it in the next version. What problems are you having?
i installed “tabulator-tables”: “5.2.5” (lastest) and ”@types/tabulator-tables”: “5.1.2” (lastest)
It seems it requires a different installation method, we will support this in the next update. Meanwhile we are currently working on another feature.
i can wait for this, thanks you
Thanks, the update will be emailed to you once it’s ready.
Hi,
I purchased Midone VueJS 3 admin dashboard do you have an example Laravel project where this is running (doesn’t need to be with live data).?
I have been trying to get this running but css isn’t quite loading correctly.
Thanks
Hi,
Thank you for reaching out,
Did you mean Vite setup with Laravel project?
Hi,
Basically do you have an example project with this running in Laravel? I have been trying to integrate this into my project (I only want to use a selection of the components such as login / navigation etc).
For example I have integrated the Login page but css is not loading correctly, I et the error:
postcss-advanced-variables: /var/www/html/resources/css/login.css Could not resolve the mixin for “media-breakpoint-down”
this is my webpack file:
const process = require(‘process’)
const mix = require(‘laravel-mix’)
const cssImport = require(‘postcss-import’)
const webpackConfig = require(’./webpack.config’)
/*
|—-—-—-—-—-—-—-—-—-—-—-—-—-—-—
| Mix Asset Management
|—-—-—-—-—-—-—-—-—-—-—-—-—-—-—
|
| Mix provides a clean, fluent API for defining some Webpack build steps
| for your Laravel application. By default, we are compiling the Sass
| file for the application as well as bundling up all the JS files.
|
*/
mix .js(‘resources/js/app.js’, ‘public/js’) .vue({ runtimeOnly: (process.env.NODE_ENV || ‘production’) === ‘production’ }) .webpackConfig(webpackConfig) .postCss(‘resources/css/app.css’, ‘public/css’, [ // prettier-ignore cssImport(), require(“postcss-advanced-variables”), require(‘tailwindcss’), require(“autoprefixer”), ]) .version() .sourceMaps()
and my webpack.config file
const path = require(‘path’)
// https://stefanbauer.me/tips-and-tricks/autocompletion-for-webpack-path-aliases-in-phpstorm-when-using-laravel-mix module.exports = { output: { chunkFilename: ‘js/[name].js?id=[chunkhash]’ }, resolve: { alias: { ’@’: path.resolve(’./resources/js’), }, extensions: [’.js’, ’.vue’, ’.json’], }, devServer: { allowedHosts: ‘all’, }, }
Thanks
Please install this package `@left4code/tw-starter` and include this file in your main CSS file.
https://i.imgur.com/eBb5H2J.pngHi thank for getting back to me so swiftly.
I already have @left4code/tw-starter installed, and the mixin/media css file was already being imported in app.css file.
So still receiving same error as above.
Any luck looking into this? Thanks
It’s seems a little bit tricky to debug the cause of this issue. How about the postcss config did you follow the config and order of each plugin?
https://i.imgur.com/9xGkzkv.pngHi please could you send me the Laravel + Vite Setup project. Email: drc83[at]hotmail.com Thanks
Email sent.. 
Please run `composer dump-autoload` if you get error while compiling.
Thanks received – sorry but would it possible to also get a Laravel Mix version as well. Thanks
Unfortunately, we don’t have laravel mix version.
Hi Team,
How can i create dom element multiple action in Tabulator cell.
Thank you.
Hi,
Please check the following steps.
1. Prepare the modal component.
(You can place the `modal` component anywhere in your view)
https://i.imgur.com/S4Dczcm.png
(Set up `ref` for modal component bindings.)
https://i.imgur.com/yQXHmah.png
2. Create tabulator `formatter`.
(You can use the programmatic API `router.push` to redirect the page. Then to display the modal you can use the following method.)
https://i.imgur.com/wVrqKfi.png
https://i.imgur.com/HnqxHpE.png
https://i.imgur.com/kmtd4WP.png
Let me know if you have any further questions.
It’s work, thanks for help.
Glad to help.. 
Hi Team,
I can’t use Tippy component inside v-if or v-for.
Thank you.
ex. v-if -> v-for -> v-if (Tippy inside last v-if)
Hi there,
Thank you for reaching out,
Is there any very simple code to reproduce the issue?
We tried to reproduce this issue with the following code but didn’t seem to find the problem you are referring to.
https://i.imgur.com/ak6X3yH.png https://i.imgur.com/9LdwsH9.pngThanks for help.
Glad to help.. 