I would like to be able to set kendo Vue component options globally, when needed.  For example, I want all grids in my app to have "selectable" set to "row".  Right now, we're having to bind it in every view with a grid:  :selectable="gridOptions.selectable"

Doing that method requires devs to remember to add it though.  With webforms, we were able to do that using AppThemes, so we're looking for something to that effect.  Can you guys recommend a better alternative?

Hello! Can't find an example of how to change panes prop inside Kendo Vue Splitter. Like collapsable and size. Is it possible? Could you post the code?

Thanks.

Hi all,

i'm testing the vue grid component and wondering, why the sort indexes aren't shown like in the example: https://demos.telerik.com/kendo-ui/grid/sorting

Here's my test:

http://dojo.telerik.com/@ubrinker/idenomOd

TIA

ulf

Seeing some peer warnings for 7 of the wrapper packages due to dependencies on earlier versions, can these be ignored or is this a bug where the package.json for each of these is referring to earlier releases? I'm importing from @progress/kendo-all-vue-wrapper which is from the 2018.1.313 release.

+-- @progress/kendo-gauges-vue-wrapper@2018.1.313
| +-- @progress/kendo-base-components-vue-wrapper@2017.3.1026
| `-- UNMET PEER DEPENDENCY @progress/kendo-ui@~2017.3.1026
+-- @progress/kendo-listbox-vue-wrapper@2018.1.313
| +-- @progress/kendo-base-components-vue-wrapper@2017.3.1026
| `-- UNMET PEER DEPENDENCY @progress/kendo-ui@~2017.3.1026
+-- @progress/kendo-listview-vue-wrapper@2018.1.313
| +-- @progress/kendo-base-components-vue-wrapper@2017.3.914
| `-- UNMET PEER DEPENDENCY @progress/kendo-ui@~2017.3.913
+-- @progress/kendo-map-vue-wrapper@2018.1.313
| +-- @progress/kendo-base-components-vue-wrapper@2017.3.1026
| `-- UNMET PEER DEPENDENCY @progress/kendo-ui@~2017.3.1026
+-- @progress/kendo-mediaplayer-vue-wrapper@2018.1.313
| +-- @progress/kendo-base-components-vue-wrapper@2017.3.1026
| `-- UNMET PEER DEPENDENCY @progress/kendo-ui@~2017.3.1026
+-- @progress/kendo-spreadsheet-vue-wrapper@2018.1.313
| +-- @progress/kendo-base-components-vue-wrapper@2017.3.1026
| `-- UNMET PEER DEPENDENCY @progress/kendo-ui@~2017.3.1026
+-- @progress/kendo-treemap-vue-wrapper@2018.1.313
| +-- @progress/kendo-base-components-vue-wrapper@2017.3.1026
| `-- UNMET PEER DEPENDENCY @progress/kendo-ui@~2017.3.1026

I need a simple sample for doing a custom treeview template (not the checkbox template), where the template gets an instance of the node or node's data, so I can change the output based on the data.  I have tried doing it like the grid ones shown in this forum, but if I set a breakpoint in devtools, I can see that my function doesn't seem to be getting anything on the argument.  It does render the template though.  I had it working as a string using a kendo template, but then couldn't call something back on my component, so figured I need a "proper" Vue template for it.  Maybe I'm missing something simple here.

My method that is returning the template:

    public itemTemplate(e: any): any {

        return {
            template: FieldGroupTemplate,
            templateArgs: e
        }
    }

My template component (we use Typescript):

import Vue from "Vue";
import Component from "vue-class-component";
import { Prop } from "vue-property-decorator";
import { lazyInject } from "Areas/Ordering/OrderingIocContainer";

@Component({

    template: "<div>{{ templateArgs.name }}</div>",     
    components: {
    }
})
export default class FieldGroupTemplate extends Vue {
    public templateArgs!: any;

    constructor() {
        super();
    }
}

Some markup, from where a template has the treeview:

<kendo-tree-view id="fieldSelectorTreeView" :data-source="items"

                                 @@select="select"
                                 :data-text-field="'name'"
                                 :checkboxes="checkboxes"
                                 :template="itemTemplate"
                                 @@check="check" style="height:615px">
                </kendo-tree-view>

How can I validate the title if it is empty

fields: {
taskId: { type: 'number' },
title: { validation: { required: true } },  /* Validation not working */
start: { type: 'date'},
end: { type: 'date' },
IdUsuario: { defaultValue: 1 },
IdSucursal: { nullable: true },
}

<kendo-scheduler :data-source="localDataSource"
:date="date"
:timezone="'Etc/UTC'"
:allDaySlot="false"
:height="750"
schema-model-id="taskId"
:schema-model-fields="fields"
:resources="catalogs"
:messages="messages"
@change="onChange"
@edit="onEdit"
@add="onAdd"
@cancel="onCancel"
@dataBound="onDataBound"
@move="onMove"
@navigate="onNavigate"
@resize="onResize"
@save="onSave">
<kendo-scheduler-view :type="'day'" :selected="true"></kendo-scheduler-view>
<kendo-scheduler-view :type="'workWeek'"></kendo-scheduler-view>
<kendo-scheduler-view :type="'week'"></kendo-scheduler-view>
<kendo-scheduler-view :type="'month'"></kendo-scheduler-view>
<kendo-scheduler-view :type="'agenda'"></kendo-scheduler-view>
</kendo-scheduler>

Hello,

I have been working with the Vue bindings for the Scheduler, and I ran into an issue with the scheduler resources not reacting properly to state changes. I believe this is a bug. It should be noted that this issue does not occur with the top-level scheduler data source. It reacts properly to async loading. Here's the issue:

Setting `:resources` to a static array of values (via state or getter) causes the scheduler to render correctly when grouping by that resource.

Example: 

Setting `:resources` to an async generated array of values (via state or getter) causes the scheduler to render nothing when grouping by that resource, even when the state/getter is updated and re-evaluated.

Example:

Same as above, except the getter returns a state value that is initialized to an empty array and on created we call something like this to load the data. Once the data has been loaded, the expected behavior is that the Scheduler will update to reflect the new resources.

Workaround

I have been able to get around this by using a `kendo.data.DataSource` and setting a `read` function that manually dispatches the async fetch and returns the result. This delays the rendering of the scheduler until the resources are available. That looks like this:

I have included a minimal example to illustrate the issue. By default, the incorrect behavior is used. To switch to the workaround showing correct behavior, just look at `KendoSchedule.vue` and comment out the lines in `createPersonResource()`

I have a dropdownlist that reads the datasource from a webserver, and the problem is that when using v-model sometimes the dropdown displays as empty because the server call takes a bit longer to return the items for the dropdown.

¿How can I solve this problem?

Thanks in advance.

I have a Kendo Vue Map with two layers: 1) a tile layer using OSM and 2) a bubble layer with a dataSource pointed to an api endpoint.  When I try to set the bubble layer's dataSource property to a component data property (this.mapPointDatasource) it does not work (see code below).  What am I missing?

...

data () {
      return {
        center: [39.5, -96],
        initialZoom: 4,
        mapPointDatasource: new kendo.data.DataSource({
          transport: {
            read: {
              url: 'http://<myJsonEndPoint>',
              dataType: 'json',
              cache: false
            }
          }
        }),
        layers: [
          {
            type: 'tile',
            urlTemplate: 'http://#= subdomain #.tile.openstreetmap.org/#= zoom #/#= x #/#= y #.png',
            subdomains: ['a', 'b', 'c']
          },
          {
            type: 'bubble',
            //dataSource: this.mapPointDatasource,  // <- DOES NOT WORK
            dataSource: {  // <-- WORKS
              transport: {
                read: {
                  url: 'http://<myJsonEndPoint>,
                  dataType: 'json',
                  cache: false
                }
              }
            }
          }
        ]
      }
    },

...

I have a kendo upload inside a kendo window with ref=upload. On window activate I want to clear the files list. 

activate() {

    this.$refs.upload.kendoWidget().clearAllFiles();

}

Everything works fine until I upload a file. Once a file is uploaded the call to this.$refs.upload.kendoWidget() starts returning null.