Telerik Forums
Kendo UI for Vue Forum
1 answer
447 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
2 answers
588 views

Hi

 

I'm using Kendo Scheduler Component

I use only month view and i want change the format of the current date.

I attached a description picture.

 

Please give me solution. Thank you.

Martin
Telerik team
 answered on 03 Apr 2020
5 answers
262 views

Hello,
We have implemented Kendo Vue Donut chart, using visual function, that in most cases rendered well.
But we found that on certain devices (regardless bigger or smaller) the chart renders each slice of the donut as a full circle and puts them all one on top of the other. The attached image demonstrates it.
Our investigation shows that it is the result of the seriesDefaults holeSize value AND the visual function stroke line width.
Both are determined programmatically at run time.


The following values result with the correct donut you see in the image:
holeSize: 83
visual stroke width: 22 (or less)


And the following values result with the incorrect donut:
holeSize: 83
visual stroke width: 23 (or more)


Notice it is also related to the holeSize - for example the following will be rendered well:
holeSize: 85
visual stroke width: 23 (or more)


And holeSize 84 with visual stroke width of 23 is rendered incorrectly.


Can you please advise how we can make sure it will always be rendered correctly? Is there a certain ratio between the holeSize and the visual stroke width we need to maintain?


Thanks,

Ron.

Teya
Telerik team
 answered on 25 Mar 2020
1 answer
138 views
I am having a peculiar issue that may not even have a solution at least in regards to a Kendo UI chart property for Vue. The issue is that given a set of data points the chart is supposed to show a curve (the data is basically showing a degradation curve). Instead of a curve, the chart is display a straight line. I am not sure if there is a setting for the chart that can force the curve or if it needs to happen as a result of some kind of algorithm/calculation on the data itself. I have attached an image showing what the chart is essentially doing and what it needs to be doing. Any insight into this would be extremely helpful and appreciated. Thanks.
Paul
Top achievements
Rank 1
 answered on 20 Mar 2020
1 answer
90 views

There is not documentation on how to use the onFocus prop on the native Vue input component.

https://www.telerik.com/kendo-vue-ui/components/inputs/api/InputProps/

 

I have tried binding a function to the prop but it doesn't not seem to be running. Could you update your documentation to provide an example on how to use this?

This is an example of how I tried it.

https://stackblitz.com/edit/wcvyxe

Plamen
Telerik team
 answered on 20 Mar 2020
1 answer
193 views
HI, 

I'm working with the Project using Kendo Vue Grid Wrapper, and my client want to make the pagination always on the bottom,
Can we customize the Kendo Grid Wrapper pagination,to make it fixed on the bottom section?


Best Regards
Thank you
Martin
Telerik team
 answered on 18 Mar 2020
2 answers
442 views

Hi,

I'm new on the Kendo UI for Vue, 

I Have some difficulty when working on in sorting, for some reason the sorting model value always null, I'm using DataSourceRequest model.

API 

[HttpGet("grid")]
public IActionResult ListGrid([DataSourceRequest] DataSourceRequest request) {
  // My code here
 }

 

Vue

<kendo-datasource ref="datasource1"
                           :transport-read-url="'/api/service/grid'"
                           :transport-read-data-type="'json'"
                           :server-paging="true"
                           :page-size="2"
                           :schema-data="'data'"
                           :schema-total="'total'"
                           :server-filtering="true"
                           :server-sorting="true">
         </kendo-datasource>
 
         <kendo-grid ref="grid"
                     :data-source-ref="'datasource1'"
                     :pageable='true'
                     :sortable="true"
                     :filterable="true"
                     :sortable-mode="'multiple'"
                     :sortable-allow-unsort="true"
                     :sortable-show-indexes="true">
             <kendo-grid-column title="Name" field="name"
                                :filter-search="true"></kendo-grid-column>
             <kendo-grid-column title="Description"></kendo-grid-column>
             <kendo-grid-column title="Users" field="relatedUser"></kendo-grid-column>
             <kendo-grid-column title="Active" field="isActive"
                                :template="activeTemplate"></kendo-grid-column>
             <kendo-grid-column :template="editbutton" :width="80"></kendo-grid-column>
         </kendo-grid>

 

Please help me,

Best Regards

 


Plamen
Telerik team
 answered on 18 Mar 2020
1 answer
154 views

Passing in a number value will cause the native vue input component to throw a warning in the browser console.

      "Invalid prop: type check failed for prop "value". Expected String with value "1", got Number with value 1"

No warning should be thrown when passing a number value as it's considered a valid type in the api documentation.

Also the defaultValue should have the Number type valid as well.

 

Url of example:

https://stackblitz.com/edit/typescript-nbhffs?embed=1&file=index.html

Might be related to this issue in core

https://github.com/telerik/kendo-ui-core/issues/3843

Plamen
Telerik team
 answered on 13 Mar 2020
2 answers
233 views

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

Ed
Top achievements
Rank 1
 answered on 13 Mar 2020
3 answers
524 views

Hi, 

Is dragging a row from view grid wrapper component available? There's nothing in here

Nikolay
Telerik team
 answered on 12 Mar 2020
Narrow your results
Selected tags
Tags
Grid
General Discussions
DropDownList
DatePicker
Editor
Grid wrapper
Scheduler
DropDownTree wrapper
Spreadsheet wrapper
Calendar
Input
MultiSelect
NumericTextBox
DateInput
DateTimePicker
Editor wrapper
Styling / Themes
DataSource wrappers (package)
Scheduler wrapper
Chart wrappers (package)
Gantt wrapper
Localization
Chart
Checkbox
ComboBox
Window
Pager
Error
Upload
DropDownList wrapper
Popup
Form
Tooltip
TreeView
Dialog
MultiSelect wrapper
NumericTextBox wrapper
Slider
Toolbar wrapper
Upload wrapper
Validator wrapper
ColorPicker
Button
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
RadioButton
FloatingLabel
TextArea
Drawer
Stepper
DateRangePicker
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
RadioGroup
Hint
Loader
ProgressBar
Switch
Wizard
Skeleton
ScrollView
ColorGradient
ColorPalette
FlatColorPicker
ButtonGroup
TileLayout
ListBox
ExpansionPanel
BottomNavigation
AppBar
Signature
ChunkProgressBar
VS Code Extension
SpeechToTextButton
+? more
Top users last month
Rob
Top achievements
Rank 3
Bronze
Iron
Iron
Sergii
Top achievements
Rank 1
Iron
Iron
Dedalus
Top achievements
Rank 1
Iron
Iron
Lan
Top achievements
Rank 1
Iron
Doug
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Top users last month
Rob
Top achievements
Rank 3
Bronze
Iron
Iron
Sergii
Top achievements
Rank 1
Iron
Iron
Dedalus
Top achievements
Rank 1
Iron
Iron
Lan
Top achievements
Rank 1
Iron
Doug
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?