Telerik Forums
Kendo UI for Vue Forum
17 questions
Sort by
6 answers
123 views

Hi, 

is there a way to open the date picker programmatically by  passing a property? If not are there any alternative ways to do this? I need to open the date picker on label click in vue using  type script.

Thanks

Veselin Tsvetanov
Telerik team
 answered on 20 Aug 2019
5 answers
50 views

Hello,
We use kendo for Vue and tried implementing a DateInput element in our Vue app.


When we try to use this element on a smartphone, we hoped it will use the OS date input, just like it works with any <input> element of type “date”. But we found it is rendered as type “text”.


This means the UX is not as good as we hoped it will be.
Is there a way to render it as <input> of type “date” so it will behave accordingly?

https://www.telerik.com/kendo-vue-ui/components/dateinputs-wrapper/dateinput/

 

Thanks,

Ron.

Petar
Telerik team
 answered on 12 Nov 2020
1 answer
845 views

I have a VueJS app that uses the kendo controls.

Is there a way to use the datepicker or another kendo control to select multiple dates? For example by holding the Ctrl+clicking on each date?

Is there an example?

 

Petar
Telerik team
 answered on 08 Apr 2022
1 answer
60 views

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.

https://stackblitz.com/edit/nlfavc?file=src/main.vue

Wesley
Top achievements
Rank 1
Iron
 updated question on 18 May 2022
1 answer
265 views

Hello Folks, 

After updating vue to lattest version, I have this error after each 'npm run build' command:

 

Maybe, you have some project example with vue 3 and these libs (@progress/kendo-base-components-vue-wrapper,  @progress/kendo-base-components-vue-wrapper etc).

Here is my packege.json:

{
  "name": "",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build --mode development",
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
    "vue": "3.0.11",
    "vue-template-compiler": "^2.6.12",
    "@progress/kendo-base-components-vue-wrapper": "^2021.1.330",
    "@progress/kendo-charts-vue-wrapper": "^2021.1.330",
    "@progress/kendo-inputs-vue-wrapper": "^2021.1.330",
    "@progress/kendo-licensing": "^1.1.4",
    "@progress/kendo-popups-vue-wrapper": "^2021.1.330",
    "@progress/kendo-theme-bootstrap": "^4.35.1",
    "@progress/kendo-ui": "^2021.1.119",
    "@progress/kendo-vue-dateinputs": "^2.1.5",
    "@progress/kendo-vue-dropdowns": "^2.1.5",
    "@progress/kendo-vue-inputs": "^2.1.5",
    "@progress/kendo-vue-intl": "^2.1.5",
    "axios": "^0.21.1",
    "bootstrap": "^4.6.0",
    "cldr-core": "36.0.0",
    "cldr-dates-full": "36.0.0",
    "cldr-numbers-full": "36.0.0",
    "core-js": "^3.6.5"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "~4.5.0",
    "@vue/cli-plugin-eslint": "~4.5.0",
    "@vue/cli-service": "~4.5.0",
    "@vue/compiler-sfc": "^3.0.11",
    "babel-eslint": "^10.1.0",
    "eslint": "^6.7.2",
    "eslint-plugin-vue": "^6.2.2",
    "vue": "3.0.0"
  },
  "eslintConfig": {
    "root": true,
    "env": {
      "node": true
    },
    "extends": [
      "plugin:vue/essential",
      "eslint:recommended"
    ],
    "parserOptions": {
      "parser": "babel-eslint"
    },
    "rules": {}
  },
  "browserslist": [
    "> 1%",
    "last 2 versions",
    "not dead"
  ]
}

 

 

Thanks.

Andrew
Top achievements
Rank 1
Iron
 answered on 05 May 2021
3 answers
198 views

Hi,

By using the Kendo validator on a modal window (kendo-window) containing some required fields, I've got this issue:

  • I try to save everything without filling the fields, the validation messages will appear below the required fields, resizing the modal window;
  • I fill a required field and then click the save button. This required field will lose its focus, triggering the validation event that will hide the validation message, thus resizing the window and because of that, the click event on that save button will not be fired because the button is not below the cursor anymore;

I saw that there is a validateOnBlur option that I need to be enabled but it is used only when the field lose its focus. Is there a way to fire the validation event while the user is typing or changing the field data? It would fix that problem because the modal window will be resized before the user can click on the save button.

I am using the VueJS Wrappers.

Thanks

Nencho
Telerik team
 answered on 27 Mar 2018
1 answer
72 views

I have some grids that have a date/time column. The default equality operators for the filter match both the date and time. I am trying to customize the equality operator (or add a new operator) that ignores the time and only compares the date. Using a custom operator works the first time I select the operator. When I go back to the filter menu after setting it the first time, the dropdown has no operator selected and I changing the value again doesn't work until after I select equals again.

How can I have the equals operator remain selected or add a new operator?

If this isn't supported, are there any other ways I can accomplish the same thing? I want to display both the date and time, but have equals only filter on the date.

Here is some example code: https://stackblitz.com/edit/custom-filter-only?file=src/main.vue

Petar
Telerik team
 answered on 30 Jun 2021
Narrow your results
Selected tags
Tags
Grid
General Discussions
DropDownList
Grid wrapper
DropDownTree wrapper
DatePicker
Spreadsheet wrapper
Editor wrapper
Input
NumericTextBox
Editor
DataSource wrappers (package)
DateInput
MultiSelect
Scheduler wrapper
Styling / Themes
DateTimePicker
Gantt wrapper
Pager
Checkbox
Upload
Scheduler
Calendar
DropDownList wrapper
Localization
Window
Tooltip
Chart wrappers (package)
Dialog
NumericTextBox wrapper
Popup
Toolbar wrapper
Upload wrapper
Validator wrapper
Chart
Accessibility
AutoComplete
AutoComplete wrapper
Button wrapper
ComboBox
ContextMenu wrapper
Licensing
ListBox wrapper
ListView wrapper
Map wrapper
MaskedTextBox
Menu wrapper
MultiColumnComboBox wrapper
Slider
Splitter wrapper
TabStrip wrapper
TreeView wrapper
TabStrip
Error
FloatingLabel
Form
TextArea
Stepper
Splitter
PanelBar
TreeView
Notification
Menu
TreeList
Toolbar
Animation
Barcode wrapper
ButtonGroup wrapper
Chat wrapper
ColorPicker wrapper
ComboBox wrapper
DateInput wrappers (package)
Diagram wrapper
Dialog wrapper
Gauges wrappers (package)
MaskedTextBox wrapper
MediaPlayer wrapper
MultiSelect wrapper
Notification wrapper
Pager wrapper
PanelBar wrapper
PivotGrid wrapper
QRCode wrapper
RangeSlider wrapper
ScrollView wrapper
Security
Slider wrapper
Switch wrapper
TimePicker
Tooltip wrapper
TreeList wrapper
TreeMap wrapper
Window wrapper
Card
Avatar
StockChart
Sparkline
RadioButton
RadioGroup
Hint
Drawer
Loader
ProgressBar
DateRangePicker
Switch
Gauge
Wizard
Skeleton
ScrollView
RangeSlider
ColorGradient
ColorPicker
ColorPalette
FlatColorPicker
Button
ButtonGroup
TileLayout
ListBox
ExpansionPanel
BottomNavigation
AppBar
ListView
Signature
ChunkProgressBar
FontIcon
SVGIcon
+? more
Top users last month
Bernd
Top achievements
Rank 5
Bronze
Bronze
Iron
kva
Top achievements
Rank 2
Iron
Iron
Iron
Jay
Top achievements
Rank 2
Iron
Iron
Veteran
Mark
Top achievements
Rank 3
Iron
Iron
Iron
Ruchika
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Bernd
Top achievements
Rank 5
Bronze
Bronze
Iron
kva
Top achievements
Rank 2
Iron
Iron
Iron
Jay
Top achievements
Rank 2
Iron
Iron
Veteran
Mark
Top achievements
Rank 3
Iron
Iron
Iron
Ruchika
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?