Questions on Kendo UI for Vue Forum

3 answers

558 views

Hello All,

How can possible for adding checkbox in MultiSelect option ?

if checked 1 item in MultiSelect then show item text but if more than one item is selected then I want to display the item count.

let me know if its possible.

Regards,

Rahul

answered on 12 Aug 2019

1 answer

107 views

Checkbox selection doesn't work correctly with cell template (grid native)

As I said in the title: Checkbox selection doesn't work correctly with cell template (grid native).

Broken grid screen

The checkboxes didin't show up correctly, instead all data moved one column to the left. There is my code:

HTML:

<Grid

ref="grid"

:data-items="gridData"

:columns="gridHeaders"

:pageable="pageable"

:skip="skip"

:take="take"

:page-size="pageSize"

:total="tasks.totalElements"

@columnreorder="columnReorder"

:cell-render="'myTemplate'"

:scrollable="'none'"

:selected-field="selectedField"

>

<template slot="myTemplate" slot-scope="{props}">

<td :class="props.className">

<span v-if="props.field === 'actions'">

<VTooltip

v-if="type !== 'user'"

bottom

>

<VIcon

slot="activator"

style="cursor: pointer"

@click="assignTask([props.dataItem])"

>

{{ assignIcon }}

</VIcon>

<span>{{ assignToolTip }}</span>

</VTooltip>

<VTooltip

v-if="type === 'user'"

bottom

>

<VIcon

slot="activator"

style="cursor: pointer"

:disabled="!resolverRegistered(props.dataItem)"

@click.stop="resolveTask(props.dataItem)"

>

check

</VIcon>

<span>Resolve</span>

</VTooltip>

</span>

<span v-else>{{ getNestedValue(props.field, props.dataItem) }}</span>

</td>

</template>

</Grid>

Computed:

gridData() {

if (this.tasks.content) {

return this.tasks.content.map(item => {return {'selected': false, ...item}})

} else {

return []

}

},

areAllSelected() {

if (this.tasks.content) {

return this.tasks.content.findIndex(item => item.selected === false) === -1

} else {

return false

}

},

gridHeaders() {

return [

{field: 'selected', headerSelectionValue: this.areAllSelected}, ...this.headers

]

}

Methods:

getNestedValue(fieldName, dataItem) {

const path = fieldName.split('.');

let data = dataItem;

path.forEach((p) => {

data = data ? data[p] : undefined;

});

return data;

},

Data:

selectedField: 'selected',

Am I doing something in a wrong way? Or I have to implement those checkboxes in my own way.

I would be grateful for any help! :)

Grid

answered on 09 Aug 2019

11 answers

281 views

scheduler drop event for external items

Is there way to identify drop from external item ie. a list item from a list. into the scheduler?

I want to create appointments on drop event inside schedular.

Thank you in advance.

Grid

answered on 09 Aug 2019

1 answer

127 views

Grid (Native) Header cell in 2019.2.621

After updating to version 2019.2.621,table headers now has anchor tags with a style set to have cursor pointer.

To reproduce, this just take a look at the overview's basic usage example here https://www.telerik.com/kendo-vue-ui/components/grid-native/

Grid

answered on 06 Aug 2019

4 answers

145 views

.kendo-multiviewcalendar --> WeekNumber column click event

HI,

I used "kendo-multiviewcalendar" component & i want to select whole week days related week number by clicking on the weeknumber.

is any options to enable this? or what is the way to implement it

Like,

selection

:week-number="true"

:selectable="'multiple'"

answered on 06 Aug 2019

6 answers

439 views

How can bind routing link in kendo ui treeview in vue js ?

I am facing issue with to bind the routing link directly in Kendo UI Treeview and for more details, I have put a router-link property in not working and you can view my code below.

01.<div id="vueapp" class="vue-app">

02.<kendo-treeview>

03. <kendo-treeview-item text="User Setting" >

04.

05. <kendo-treeview-item text="User" router-link ="/setting/user" >User</kendo-treeview-item>

06. <kendo-treeview-item text="Role" router-link ="/setting/role"> </kendo-treeview-item>

07. <kendo-treeview-item text="Password Setting" router-link ="/setting/password"></kendo-treeview-item>

08.

09. </kendo-treeview-item>

10.

11. <kendo-treeview-item text="Group Setting" >

12.

13. <kendo-treeview-item text="Group"></kendo-treeview-item>

14. <kendo-treeview-item text="Group setting"></kendo-treeview-item>

15.

16. </kendo-treeview-item>

17.

18.

19.</kendo-treeview>

20.

21. </div>

answered on 05 Aug 2019

2 answers

636 views

How can i refresh grid datasource by button event?

How can i refresh grid datasource by button event.

I want to display data in certain time that user push the button.

How can i handling grid refresh event?

Grid

answered on 05 Aug 2019

1 answer

129 views

Is there a way to conditionally style a row for grid wrapper?

I am wanting to style a row and just change the background color based on the value of a certain cell of the row.

I am unsure on how to do this.

Grid

answered on 02 Aug 2019

2 answers

330 views

How to set Authorization header for transport read?

I already searched about this question and found answer for Kendo UI for jQuery.

but how can it be possible for Vue?

Grid

answered on 02 Aug 2019

1 answer

304 views

Multi-Day view in Kendo Scheduler

Hi

Can we have a Multi-Day view in Kendo Scheduler for Vue. I tried with passing a date array to kendo-scheduler but its accepting a date. Is there a way to do this?

Thanks

answered on 31 Jul 2019