Hi ,
Attached is a version of JavaScript we use to bind dynamic data to kendo grid with dynamic columns and server side grouping enabled. (As seen in the logic, we use a group column to group and ungroup column to ungroup on a field.)
I am looking forward for implementing the below. Please provide a sample version of the modified js file and/or links to appropriate client side events that can support these in a logical order.
1. How to disable the default behavior of drag and drop on grouping , but still show the grouping grey bar above the grid?
I tried the below but it is not working(can't find the equivalent draggable event for group)
https://docs.telerik.com/kendo-ui/controls/interactivity/draganddrop/how-to/disable-dragging-runtime
2. Provide a “clear groups” button in the grouping bar and upon clicking that button, clear all groups. (Please note that the “clear groups“ button to be shown, only when at least one group is enabled.
3. Show the Grouping grey bar if you group by at least one column and hide the grey bar, if there are no columns to group by. Please confirm if the logic implemented in the attached file to hide and show the grouping grey bar is the correct approach.
Thanks,
I have a Grid with a filter, similar to this one:
https://demos.telerik.com/kendo-ui/filter/persist-state
the only exception is that I am also using the search box (toolbar: search).
https://dojo.telerik.com/IpejApos
The problem I have is, that when I filter the data; for example:
Thank you in advance,
Syian
I would like to show a clickable URL within a Kendo Grid that opens a bootstrap modal. Unfortunately, when the user clicks on this link, the browser navigates to a new page to show the results.
The code below is supposed to open a partial view that would load the proper data for the specified LotId.
Any help would be greatly welcomed.
Thanks!
@(Html.Kendo().Grid<
LotViewModel
>()
.Name("LotGrid")
.Columns(columns =>
{
columns.Bound(x => x.LotName).ClientTemplate(@Html.ActionLink("#=LotName#", "ShowLotModal", "Lot", new { id = "#=LotId#" }, null));
})
// Etc...
I want to create MVVM Kendo Grid where it is grouped in multiple levels and also want a nested grid or a hierarchical grid for each parent's grid row i.e. each k-master-row . In the ScreenShot Is it possible to create a Nested/ Child / Hierarchical Grid for each row? If yes, Can someone please provide me with sample demo.
I didn't find any documentation or helpful resource?
Parent Grid:
Grouped by Field 1
Grouped By Field 2
Row1
Nested / Child Grid with child Grid Columns For ROW1
Row2
Nested / Child Grid with child Grid Columns For ROW 2
How can I extend this view with more fields?
I have a Scheduler Project that allows for the selection on multiple "Attendees" like some of the samples.
My problem is how to save that field to a Web API with a MS SQL backend.
The CRUD endpoints work perfectly until I introduce the Attendee's array.
e.g. [1,2]
I can define it in the Model as type: "string" and it will save it in the SQL as nvarchar(MAX).
Just can't get it back.
Any help would be appreciated.
Ed
Hi, I use kendo ui for jquery media player in blazor project. On page load i call media player by this code;
await JSRuntime.InvokeAsync<string>("EmbedVideo", record.Id, record.Title);
and my javascript code is;
function EmbedVideo(recordId,title) {
$("#mediaplayer").kendoMediaPlayer({
autoPlay: true,
navigatable: true,
media: {
title: title,
source: "/api/record/GetRecordFile?recordId=" + recordId +"+&fileRequestType=1"
},
timeChange: function () {
console.log('changed')
}
});
}
when i change time i can see the 'changed' log in console but video starting over again.
These ara my referances;
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2021.1.330/js/kendo.all.min.js"></script>
There is an HTML element, called "template", more information here: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/template. We cannot use this element in a Kendo Editor, because it will always remove all contents from this element.
It can be reproduced in your demos here: https://demos.telerik.com/kendo-ui/editor/all-tools by following these steps:
Click the "View HTML" tool/button, then add this HTML to it:
<h1>Hello</h1>
<p>This is a test</p>
<template><p>This is a template</p></template>
Click "Update".
Then open the "View HTML" tool again. You now see that the HTML has been changed to this:
<h1>Hello</h1>
<p>This is a test</p>
<template></template>
Hello,
I'm using LitElement to create a reusable tab component, but when I 'm initializing the kendoTabStrip, the TabStrip property is undefined.
In my firstUpdated function I'm setting the TabElement property:
firstUpdated (changedProperties) { this.TabElement = this.shadowRoot.querySelector('#tabs-container') }
In the parent element, I'm setting the TabConfig property:
setHtml () { const tabs = this.shadowRoot.querySelector('tabs') tabs.TabConfig = TabConfig(this) }
I have a setter in the tabs component that addsTabs after being set:
set TabConfig (value) { const oldValue = this._TabConfig this._TabConfig = value const self = value.self this.addTabs(self, oldValue) }
I'm initializing the kendoabStrip using the previously set properties (all properties are defined):
addTabs () { this.TabStrip = $(this.TabElement).kendoTabStrip(this.TabConfig).data('kendoTabStrip') this.TabConfig.tabs.forEach(tab => { if (tab.show) { this.TabStrip.append(tab) // This throws an error "Cannot read property append of undefined" } }) }
I tried initializing the TabStrip property in the setter for the TabConfig, but ended up with the same result. Any idea as to why this.TabStrip is undefined?