Setting Custom Editor shows kendoDropDownList is not a function - vue.js

We like to use dropdown inside the grid, so we using this (https://www.telerik.com/kendo-vue-ui/components/grid/editing/#toc-setting-custom-editors) example in our project we are getting this error:
Uncaught TypeError: $(...).appendTo(...).kendoDropDownList is not a function
at VueComponent.categoryDropDownEditor (git.vue?26ca:154)
Could anyone help me on this?

Answering my own question it may helpful for someone
by adding kendo.all.min.js it working fine :)
But don't know why it wont included in default kendo vue.
<script src="http://kendo.cdn.telerik.com/2018.3.1017/js/kendo.all.min.js"></script>

Related

Datatables pagination button styling problem, no CSS there

There are no error in console, I have no idea about that
it's because the jquery.datatables.min.js I import without jquery.datatables.min.css,
please someone at datatables they need to give error for this

Basic Snackbar Example doesn't show on Material Design Components for Web

The basic example of snackbar for Material Design Components for Web doesn't work. It produces the error:
```
TypeError: snackbar.show is not a function
```
I have tried using jQuery to make sure the DOM loaded properly. I have tried changing back and forth the javascript initialisation methods, but none seems to work.
You can find the code here: https://jsbin.com/mejefeq/edit?html,console,output
I have read the docs over and overs again, but none of it mentioned anything about this. Since this MDC for Web is not at all popular, I have nowhere left to go for help.
Yeah that was a breaking change in the 0.43.0 update. The new way of showing the snackbar is by using
snackbar.open();
This however will just open the snackbar. If you want to change the text in the snackbar you can use:
snackbar.labelText = 'Your new text';
So together you can use them:
snackbar.labelText = 'Your new text';
snackbar.open();
You can check out more of the documentation here, with the current javascript properties and events here

How do I binding dynamic img src w/require

How can I bind the following dynamically? It’s for user feedback in case of an error, so I’d like to avoid rendering it unless needed.
I’m using the vuetify boilerplate. This works when inside the template as is:
v-img :src="require('../assets/error.png')"
I’d like to set it dynamically :src=null to :src="errorImg" when receiving an error. The require is throwing me off.
Any help greatly appreciated!
This worked:
if error
this.errorImg = require("../assets/error.png");

Array doesn't work in Vue

This code works well. But if I change the code, it doesn't work.
I'd like anyone to help me if they has experience in Vue.js.
It does work, it should be used like this {{colorList[0]}} not {{this.colorList[0]}}since vue template is using the “Mustache” syntax.

Bootstrap 3 validation using bootstrapValidator with input-group not display error properly

I am using Bootstrap 3 and for validation using bootstrapValidator(https://github.com/nghuuphuoc/bootstrapvalidator). It is dislaying error message proplerly for input field but not working with
input-group(https://github.com/victorjonsson/jQuery-Form-Validator/issues/126)
As shown in above github link, same issue occur to me and here is the solution for jquery form validator ,not for bootstrapvalidator.
can anyone help me to solve this issue?
You can check code here:
[Code][1] http://codepen.io/creativedev/pen/LVqKEg
Thanks in advance.