We have a Kendo vue UI Grid column with Vue bootstrap Datepicker as a custom column.
When we click the calender icon it is partially showing inside the cell. I want it to be show as an popup outside the cell.
Below is the code snippet from the custom cell component
<template>
<td class="cell-editable">
<b-input-group>
<b-form-input
:value="aufValue | date"
type="text"
placeholder="tt.mm.jjjj"
:disabled="!canEdit"
></b-form-input>
<b-input-group-append>
<b-form-datepicker
size="sm"
button-only
:value-as-date="true"
v-model="aufValue"
locale="de-AT"
:disabled="!canEdit"
></b-form-datepicker>
</b-input-group-append>
</b-input-group>
</td>
<template>
right now it show like the attached screenshot:
Please suggest a solution for achieving the same.
Thank You
I'm getting the following in my Debug Console when I run my application;
License activation failed for @progress/kendo-ui v2023.1.425
No license found.
See https://docs.telerik.com/kendo-ui/intro/installation/using-license-code for more information.
This despite having the license file present in my project root. At the moment, I have removed the environment variable since I thought it might be causing a conflict.
I have also used npm uninstall to remove all my local packages and I have reinstalled the. Her eis my current package.json;
{ "name": "wpgts", "version": "0.1.0", "private": true, "scripts": { "serve": "vue-cli-service serve", "build": "vue-cli-service build", "lint": "vue-cli-service lint" }, "dependencies": { "@progress/kendo-file-saver": "^1.1.1", "@progress/kendo-licensing": "^1.3.0", "@progress/kendo-map-vue-wrapper": "^2023.1.314", "@progress/kendo-svg-icons": "^1.4.2", "@progress/kendo-theme-default": "^6.2.0", "@progress/kendo-theme-fluent": "^6.2.0", "@progress/kendo-ui": "^2023.1.314", "@progress/kendo-vue-buttons": "^3.9.1", "@progress/kendo-vue-dateinputs": "^3.9.1", "@progress/kendo-vue-dialogs": "^3.9.1", "@progress/kendo-vue-dropdowns": "^3.9.1", "@progress/kendo-vue-form": "^3.9.1", "@progress/kendo-vue-indicators": "^3.9.1", "@progress/kendo-vue-inputs": "^3.9.1", "@progress/kendo-vue-intl": "^3.9.1", "@progress/kendo-vue-layout": "^3.9.1", "core-js": "^3.8.3", "jquery": "^3.6.4", "register-service-worker": "^1.7.2", "rxjs": "^6.6.7", "vue": "^3.2.13", "vue-router": "^4.0.3", "vue-rx": "^6.2.0" }, "devDependencies": { "@types/jquery": "^3.5.16", "@typescript-eslint/eslint-plugin": "^5.4.0", "@typescript-eslint/parser": "^5.4.0", "@vue/cli-plugin-eslint": "~5.0.0", "@vue/cli-plugin-pwa": "~5.0.0", "@vue/cli-plugin-router": "~5.0.0", "@vue/cli-plugin-typescript": "~5.0.0", "@vue/cli-service": "~5.0.0", "@vue/eslint-config-typescript": "^9.1.0", "eslint": "^7.32.0", "eslint-plugin-vue": "^8.0.3", "typescript": "~4.5.5" }, "eslintConfig": { "root": true, "env": { "node": true }, "extends": [ "plugin:vue/vue3-essential", "eslint:recommended", "@vue/typescript/recommended" ], "parserOptions": { "ecmaVersion": 2020 }, "rules": {} }, "browserslist": [ "> 1%", "last 2 versions", "not dead", "not ie 11" ] }
Why am I getting this licensing issue despite having followed the instruction at this link;
https://www.telerik.com/kendo-vue-ui/components/my-license/
Any help would be greatly appreciated.
Thanks...
Hello,
I am using scheduler (kendo-vue-scheduler) and calendar (kendo-vue-dateinputs)
in my project. I am using month view and we have a requirement where I have to set Monday like first day in week. How can I do that?
Thanks & Regards
Daniela
Currently I have a website that runs Kendo for jQuery which uses multiple cultures in the old Wrapper Components way. I want to re-use these files to change the culture of the new Kendo Native Components. Is that possible? If not, how can I do this with the new culture implementation.
Below I have added a Stackblitz with jQuery culture and Native Components which isn't working atm.
Hi i want to ask about editor in native component like in this demo Link
so i have 2 problem so far when implementing editor.
first question is when i set value in v-model and load page, i can get value after load finish but i cant type anything in editor
this is my setup code :
second question is that popup tools css like insert image or insert code looks broken when i open it
i upload screenshot for your reference about my second question
you can ask more detail if my question is confusing
thanks
Hello,
Just wondering if there is a way to have the datetimepicker for Vue, the native datetimepicker, to be blank by default instead of the input mask looking text?
Kind regards,
David
I'm experiencing severe clashes when using native packages with the DropDownTree wrapper. I was only using the wrapper packages before and everything was working fine, however now that I added the native grid to the app the wrapper DropDownTree is giving me Uncaught ReferenceError: jQuery is not defined
I remove all non standard code and still it comes out like the CSS is never applied on top of some other broken stuff.
I'm on VueJS 2.7.14
"@progress/kendo-data-query": "^1.6.0",
"@progress/kendo-drawing": "^1.17.3",
"@progress/kendo-dropdowntree-vue-wrapper": "^2023.1.117",
"@progress/kendo-licensing": "^1.3.0",
"@progress/kendo-svg-icons": "^1.1.1",
"@progress/kendo-theme-default": "^6.0.3",
"@progress/kendo-ui": "^2023.1.117",
"@progress/kendo-vue-animation": "^3.8.1",
"@progress/kendo-vue-data-tools": "^3.8.1",
"@progress/kendo-vue-dateinputs": "^3.8.1",
"@progress/kendo-vue-dropdowns": "^3.8.1",
"@progress/kendo-vue-excel-export": "^3.8.1",
"@progress/kendo-vue-grid": "^3.8.1",
"@progress/kendo-vue-indicators": "^3.8.1",
"@progress/kendo-vue-inputs": "^3.8.1",
"@progress/kendo-vue-intl": "^3.8.1",
"@progress/kendo-vue-popup": "^2.7.3"
I used these packages before and everything was fine:
"@progress/kendo-dropdowntree-vue-wrapper": "^2021.3.1207",
"@progress/kendo-licensing": "^1.2.1",
"@progress/kendo-theme-default": "^4.43.0",
"@progress/kendo-ui": "^2021.3.1207"
If anyone could tell me how to use the css file from @progress/kendo-theme-default": "^4.43.0" inside a component I think that would solve my problem.
Plea for help: Our front end guy left, and I've inherited his work :( I like the JS stuff, but I'm no expert.
Our new app has about a 4 megabyte app.js download, even when minified. We've turned on gzip compression on the server, and that gets it down to a bit over a meg, but we had a $1000 bandwidth overage last month!
I've been tasked with seeing if we are including unused code.
So, my question: In the docs I see this:
// As an alternative, you could import only the scripts that are used by the utility:
// import '@progress/kendo-ui/js/kendo.data' // Imports only the DataSource script and its dependencies
import '@progress/kendo-theme-default/dist/all.css'
import { DataSource,
HierarchicalDataSource,
GanttDataSource,
GanttDependencyDataSource,
PivotDataSource,
SchedulerDataSource,
TreeListDataSource,
DataSourceInstaller } from '@progress/kendo-datasource-vue-wrapper'
Vue.use(DataSourceInstaller)
new Vue({
el: '#app',
components: {
DataSource,
HierarchicalDataSource,
GanttDataSource,
GanttDependencyDataSource,
PivotDataSource,
SchedulerDataSource,
TreeListDataSource,
DatasourceInstaller
}
})
I've got about six of these: layout, dateinputs, inputs, dropdowns, dialog, etc.
If I can identify which of the features I need from each I need from each "wrapper", can I cut this down? For instance, I'm sure we don't use gantt charts or pivots above.
Thanks,
Ed Greenberg