Telerik Forums
Kendo UI for Vue Forum
100 questions
Sort by
5 answers
70 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
3 answers
841 views

I know ListBox probably doesn't support this out of the box but I'm really struggling to find a solution to my problem.

I would like to customize the item template to contain a checkbox and a text input when it is moved to the right ListBox. I am able to put a checkbox and input in there no problem but I can't get the textbox to focus when clicked.I would also like to bind its value to the dataItem but I'm sure I can figure that part out once I'm able to actually type in the box.

Here is a Dojo demonstrating the problem:

https://dojo.telerik.com/eZuKoMoh/2

Ivan Zhekov
Telerik team
 answered on 10 Dec 2018
1 answer
346 views

Hello

I'm using the kendo Vue wrapper to implement a grid. I want to have the first column of my grid to be a checkbox column so i can select rows. As the docs suggested I wrote a selectable="true" kendo grid colomn. But no checkboxes are visible, I checked the DOM and it's because there are only input type checkbox tags with class "k-checkbox" added and not the nessecary labels with class "k-checkbox-label". I'm not sure if I'm missing something or the kendo grid column with binding :selectable isn't working properly.

<kendo-grid
    ref="vehicleGrid"
    :data-source-ref="'vehicleDataSource'"
    :groupable="true"
    :sortable="true"
    :resizable="true">
       <kendo-grid-column :selectable="true" :width="50"></kendo-grid-column>
       ...Other columns....
</kendo-grid>

 

Thanks for helping me!

Kind regards

Viktor Tachev
Telerik team
 answered on 16 Apr 2020
1 answer
24 views
If i have a TimePicker with a date-input template then the popup will not lose focus and disappear when you click elsewhere on the page (on another control input for example). When i bind to the popup 'show' property and attach handlers to the 'blur' and 'iconclicked' events i can get the popup to hide but on clicking 'Set' on the popup the 'change' event is never raised and the TimePicker input is not updated with the selected time.
Konstantin Dikov
Telerik team
 answered on 22 Dec 2023
1 answer
363 views

I'm trying to combine 2 Kendo Dropdowns + 1 Kendo Input field together inside a single Form component.

Inside this component I want to save the values from the 3 inputs a single array and pass it's value to the Kendo Form component:

https://stackblitz.com/edit/4lrva3?file=src/FormInput.vue


What's the best way to achieve this?

Thanks in advance

Plamen
Telerik team
 answered on 27 Aug 2021
1 answer
92 views

For the NumericTextBox Wrapper Component there is the following page which allows the setting and restriction of decimals within the NumericTextBox input.

For the NumericTextBox Native Component I can only find the Formats page which doesn't tell anything about the Precision of Numbers as for the Wrapper Component.

Can I only use the format prop for this by using a custom format (generated based on different regex'es) or is the old functionality related to the decimals and restrictDecimals props also available for the Native Component?

If not, how can I dynamically set or restrict the amount of numbers and decimals within the Native Component?

 
Wesley
Top achievements
Rank 1
Iron
 updated question on 15 Jun 2022
1 answer
94 views

I've added the Kendo MultiSelect component inside a Kendo Form. However once I start typing some text inside the MultiSelect it throws an error as soon as I click outside:
https://stackblitz.com/edit/bfuhyb?file=src%2FFormInput.vue (stackblitz example of the problem)

What's worse is that upon throwing this error it completely freezes the input until you remove the text (you can't see this on stackblitz since the error covers the screen).

Did I forget to add a certain property to the MultiSelect or is this a bug?

When the MultiSelect is outside of a Kendo Form it doesn't have this behavior:
https://stackblitz.com/edit/ys4zsu?file=src/main.vue (stackblitz as linked on https://www.telerik.com/kendo-vue-ui/components/dropdowns/multiselect/)

Plamen
Telerik team
 answered on 14 Sep 2021
1 answer
84 views
there is a way that the NumericTextBox control is not numeric since I need it of type string.
Nikolay
Telerik team
 answered on 03 Sep 2019
0 answers
165 views

Hi i want to ask about currency format number like in this demo Link

so i already implement currency format in input kendo ui component but still fail to remove currency symbol
is there any reference from doc? and also where is the list of locales code for currency format?

here is my setup code for currency format

import { provideIntlService } from "@progress/kendo-vue-intl";
<KInput
  type="text"
  v-model="formattedNumber"
  placeholder="Input Salary Amount"
  @blur="saveResumeAI('draft')"
>
</KInput>
computed: {
        formattedNumber: function(){
            return provideIntlService(this).formatNumber(current_salary_value, "c")
        }

    },

"@progress/kendo-vue-intl": "^3.7.1",

Kenji
Top achievements
Rank 1
Iron
Iron
 asked on 07 Feb 2023
1 answer
59 views

I'm trying to populate a grid with some async data (not in this repro for simplicity) and do the data processing inside a Vue computed function. 

However I can't seem to get the expanding/collapsing rows functionality to play along nicely.


Here's my attempt (where I save 'e.collapsedGroups' into a ref and recurse over it inside the computed):

Fkcdqd (forked) - StackBlitz

Basically the only issue that I'm still seeing is that when I collapse product name 'Apple' it will close all 'Apple' rows. You can observe this by going to the repro and collapsing 'Apple' product in the units in stock '2', and then scrolling down to the units in stock '7' and seeing there that the 'Apple' is also collapsed.


My guess is is that there must be a simpler way to implement the expand functionality with a computed, but so far haven't found a way.

I would really appreciate any input to help me along 😁

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