or
1 answer
115 views
Hi,
I'am using kendo ui for vue and I want to hide the tree list column in treeList of native component for vue.
In the documentation of the wrapper component, I can hide it with the `hidden: true` attribute.
But I can't find a way in native component.
Does anyone know how to hide column in treeList of native component for vue?
Thanks
Best Regards.
I'am using kendo ui for vue and I want to hide the tree list column in treeList of native component for vue.
In the documentation of the wrapper component, I can hide it with the `hidden: true` attribute.
But I can't find a way in native component.
Does anyone know how to hide column in treeList of native component for vue?
Thanks
Best Regards.
Filip
Telerik team
answered
on
29 Aug 2023
1 answer
96 views
Suppose i add columns =
[{
field: "Status",
title: "Status",
cell: "badgeTemplate",columnMenu: "filterTextBoxTemplate", filter: "text", headerClassName: "customMenu",
}],
So column menu not work in the grid
Vessy
Telerik team
answered
on
18 Aug 2023
0 answers
108 views
Hello
I add
v-bind:alternate-rows="true" and also add cell template it not work combinely
1 answer
299 views
How do you configure the editor tool for foreColor and backColor to display color picker? Just as in this edit control?
Vessy
Telerik team
answered
on
15 Aug 2023
0 answers
105 views
I am developing a software in which I integrate the scheduler component for VUE. By default the hours associated with business /workday are set from 8 AM to 4 PM. My question is how can I change these same hours to, for example, from 9 AM to 6 PM?
This is my code
<template>
<div v-if="this.userRole === 'Admin' || this.userRole === 'Admin Client'">
<Scheduler :data-items="sampleData" :default-date="displayDate" :views="views" :view="view" :editable="editable" :timezone="'Europe/Lisbon'" @datachange="handleDataChange" :form="'formRender'" :allDayEditor="'customAllDayEditor'">
<template v-slot:formRender="{ props }">
<customEditForm :task="props.dataItem" @selectedNormChange="handleSelectedNormChange" @responsiblesChange="handleResponsiblesChange" @cancel="props.onCancel" />
</template>
</Scheduler>
</div>
<div v-else>
<Scheduler :data-items="sampleData" :default-date="displayDate" :views="views" :view="view" :editable="editable" :timezone="'Europe/Lisbon'" @datachange="handleDataChange" :form="'formRender'" :allDayEditor="'customAllDayEditor'">
<template v-slot:formRender="{ props }">
<customEditForm :task="props.dataItem" @selectedNormChange="handleSelectedNormChange" @responsiblesChange="handleResponsiblesChange" @cancel="props.onCancel" />
</template>
</Scheduler>
</div>
</template>
<script>
import '@progress/kendo-date-math/tz/Europe/Lisbon';
import {
Scheduler
} from '@progress/kendo-vue-scheduler';
import EditorForm from './FormEditor.vue';
import {
postCreateTask,
putCreateTask,
deleteTask,
getTasksByAudit
} from "../Services/tasksService";
export default {
name: 'Calendar',
components: {
Scheduler,
customEditForm: EditorForm,
},
props: {
selectedNorm: {
type: String,
default: null,
},
isNormObligatory: {
type: Boolean,
default: false,
},
userRole: {
type: String,
required: true,
},
},
created() {
let queryString = window.location.search;
let urlParams = new URLSearchParams(queryString);
if (urlParams.has('task')) {
this.audit_id = urlParams.get('task');
this.status = "Scheduler";
this.place = "Scheduler";
this.getData()
} else {
//ERRO mostar mensagem de erro generico.
}
this.displayDate = new Date(); // Update displayDate to current date
},
data() {
return {
view: 'day',
valueProgressBar: 0,
success: false,
editable: {
add: true,
remove: true,
edit: true,
},
views: [{
name: 'day',
title: 'Day View'
}, {
name: 'workweek',
title: 'Week View'
}, {
name: 'month',
title: 'Month View'
}, {
name: 'agenda',
title: 'Agenda View'
}, ],
sampleData: [],
displayDate: new Date(),
formMode: '', // Propriedade para controlar o modo do formulário
selectedNormValue: null, // Nova propriedade para armazenar o valor da norma selecionada
isNormObligatoryValue: false,
selectedResponsiblesValue: null,
};
},
methods: {
.... // defined methods
}
< script >
This is my code
<div v-if="this.userRole === 'Admin' || this.userRole === 'Admin Client'">
<Scheduler :data-items="sampleData" :default-date="displayDate" :views="views" :view="view" :editable="editable" :timezone="'Europe/Lisbon'" @datachange="handleDataChange" :form="'formRender'" :allDayEditor="'customAllDayEditor'">
<template v-slot:formRender="{ props }">
<customEditForm :task="props.dataItem" @selectedNormChange="handleSelectedNormChange" @responsiblesChange="handleResponsiblesChange" @cancel="props.onCancel" />
</template>
</Scheduler>
</div>
<div v-else>
<Scheduler :data-items="sampleData" :default-date="displayDate" :views="views" :view="view" :editable="editable" :timezone="'Europe/Lisbon'" @datachange="handleDataChange" :form="'formRender'" :allDayEditor="'customAllDayEditor'">
<template v-slot:formRender="{ props }">
<customEditForm :task="props.dataItem" @selectedNormChange="handleSelectedNormChange" @responsiblesChange="handleResponsiblesChange" @cancel="props.onCancel" />
</template>
</Scheduler>
</div>
</template>
<script>
import '@progress/kendo-date-math/tz/Europe/Lisbon';
import {
Scheduler
} from '@progress/kendo-vue-scheduler';
import EditorForm from './FormEditor.vue';
import {
postCreateTask,
putCreateTask,
deleteTask,
getTasksByAudit
} from "../Services/tasksService";
export default {
name: 'Calendar',
components: {
Scheduler,
customEditForm: EditorForm,
},
props: {
selectedNorm: {
type: String,
default: null,
},
isNormObligatory: {
type: Boolean,
default: false,
},
userRole: {
type: String,
required: true,
},
},
created() {
let queryString = window.location.search;
let urlParams = new URLSearchParams(queryString);
if (urlParams.has('task')) {
this.audit_id = urlParams.get('task');
this.status = "Scheduler";
this.place = "Scheduler";
this.getData()
} else {
//ERRO mostar mensagem de erro generico.
}
this.displayDate = new Date(); // Update displayDate to current date
},
data() {
return {
view: 'day',
valueProgressBar: 0,
success: false,
editable: {
add: true,
remove: true,
edit: true,
},
views: [{
name: 'day',
title: 'Day View'
}, {
name: 'workweek',
title: 'Week View'
}, {
name: 'month',
title: 'Month View'
}, {
name: 'agenda',
title: 'Agenda View'
}, ],
sampleData: [],
displayDate: new Date(),
formMode: '', // Propriedade para controlar o modo do formulário
selectedNormValue: null, // Nova propriedade para armazenar o valor da norma selecionada
isNormObligatoryValue: false,
selectedResponsiblesValue: null,
};
},
methods: {
.... // defined methods
}
< script >
Paulo
Top achievements
Rank 1
Rank 1
asked
on
02 Aug 2023
0 answers
133 views
Hi,
Is it possible to add an event to the tr element when replacing the rowRender function like in this sample https://www.telerik.com/kendo-vue-ui/components/grid/styling/#toc-rows
Specifically i would like to add the contextmenu event on the table-row. I know i could do it with slots but i dont want to render the cells manually.
0 answers
96 views
Hello,
When I am currently using the Grid Wrapper component, I will use the mouse to drag to select multiple rows of data (dragToSelect). After selecting multiple rows of data for the first time, when I think about dragToSelect for the second time, the data selected for the first time will be unselected. May I ask how to prevent the selected data of multiple dragToSelect from being cancelled?
Xiuwen
Top achievements
Rank 1
Rank 1
asked
on
24 Jul 2023
0 answers
87 views
Hi I'm currently using Kendo UI Wrapper Components in a Vue project.
When there are locked columns in the Grid component and there are many rows of data, use the scroll bar to slide quickly, the locked column part and the non-fixed column part will be misaligned. This problem also occurs when I try it in the official examples, the actual effect can be seen in the attached video. How to deal with it? Thanks!
Xiuwen
Top achievements
Rank 1
Rank 1
asked
on
21 Jul 2023
0 answers
205 views
I tried to export PDF with method in my project(using vue). But , the following error occurred.
ttf.js:50 Uncaught Error: Table loca not found in directory
at Directory.readTable (ttf.js:50:1)
at TTFFont.parse (ttf.js:1210:1)
at new TTFFont (ttf.js:1202:1)
at eval (core.js:267:1)
at req.onload (core.js:246:1)
How can I solve this problem?
0 answers
162 views
Hello,
We are using kendo vue native component Grid.
FilWe do have column filtration. We noticed that when we filter a column with string values from column filter, the search that is being done, is a startsWith. For our business purposes we want to change startsWith to Contains for example.
Is there a clean way of doing this? Do you have any suggestions or examples?
Thanks
