Hi,
I have the Scheduler (Day View), I need to show my time slots (I will get it from API) in the header.
I need to show them in the header :
This API Response :
Hello,
I have a kendo grid created from an HTML table like this:
<div class="content">
<table id='k-grid'>
<thead>
<tr>
<th data-field="my_value1">Title 1</th>
<th data-field="my_value2">Title 2</th>
</tr>
</thead>
</table>
</div>
I need to update its toolbar at runtime with setOptions in another file and I can't modify the grid setup.
So I did :
const options = kendoGrid.getOptions();
if (!options.toolbar) {
options.toolbar = [];
}
options.toolbar.push(
{ template: `<div class='vr'></div>` },
{ template: `<select id='my-selector'></select>` }
);
kendoGrid.setOptions({ toolbar: options.toolbar });
But when I refresh the Grid using setOptions, the columns titles are lost and take the value of the data-field attributes.
I know this is expected behavior with reference to the setOptions documentation and the init from Table - documentation.
My goal is to make updating the toolbar completely transparent to creating the grid in order to reuse it on any table without breaking it.
How can I keep the data in the original HTML table and apply it to the newly created grid with setOptions please?
This is my code
1. I want to export master & its related child record to excel and its working fine if i didnt use grouping. but whereas if i add grouping, then its not working.
2. Also how to remove the header in child records while exporting to excel.
Expecting your help.
Hello,
I am trying to build a grid that has a combobox in it that should be filled from an Ajax request. But based on the demo on the page, I am not being able to determine where the combobox is filled.
I appreciate any help on the matter, if possible with a code sample so that I can understand it better.
Regards,
Alexandre
If I include a certain kedo ui theme like default or nova or uniform in my asp.net mvc view/web page that uses kendo ui, then what would be the quickest way to apply the kendo ui theme to everything on the asp.net mvc view i.e. to the textboxes, buttons etc.?
The asp.net mvc view/web page is always applying boostrap theme to the textboxes, buttons etc, but I want to change it so that the kendo ui theme gets automatically applied to these textboxes, buttons etc.
I know that I could execute jquery code on document ready event that looks for all elements in the web page and then changes each element to a corresponding kendo ui element (example code as below), but this would involve quite a bit of coding in jquery.
$(document).ready(function () { let allElements = document.querySelectorAll("button,input,textarea"); console.log("allElements length is " + allElements.length); for (let i=0; i < allElements.length; i++) { let emt = allElements[i]; emt.className = ""; console.log("element tag name is " + emt.tagName); if (emt.tagName === "BUTTON") { $(emt).kendoButton(); } else if (emt.tagName === "INPUT" && (emt.getAttribute("type") === "text" || emt.getAttribute("type") === "password")) { $(emt).kendoTextBox(); } else if (emt.tagName === "TEXTAREA" ) { $(emt).kendoTextArea(); } } $(".jumbotron").kendoResponsivePanel({breakpoint:769}); });
All
I have upgraded our Kendo UI spreadsheet jQuery to 2024.3.80, however it is causing strange UI issues.
The UI Loads at a huge zoom level (e.g a single icon taking over the entire screen etc...) so it is unusable
If I swap the stylesheet back to 8.2.1.tabs and all sorts look very strange
My imports are as below
I want some of my date time pickers to have a width of 140px.
https://dojo.telerik.com/@mortenma71/eSAhOyaN/9
It works when I set the width using inline style:
<input id="datepicker" value="10/10/2011" style="width:140px;" />
It doesn't work when I set the width using a CSS class.
Without !important the CSS class seem to have no effect:
<style>.width-140 { width: 140px; }</style>
<input id="datepicker2" value="10/10/2011" class="width-140" />
With !important the CSS class effects the width, however the svg-picker-icon doesn't show:
<style>.width-140-important { width: 140px !important; }</style>
<input id="datepicker3" value="10/10/2011" class="width-140-important" />
I only observed the problem now; I'm sure it worked in an earlier kendo/CSS version.
How can I set the width using a CSS class and retain the svg-picker icon?
/Morten
I have a request for a group of dropdown lists with complex filtering in the lists. The issue is that they don't want any previously selected options to be erased when filtering. My actual list can have thousands of options but for the sake of example I'm going to make it shorter:
Let's say the lists are called "favorite fruit 1" and "favorite fruit 2". Someone already chose "Banana" in favorite fruit 1. Now they want to filter the options by "Color: Red" and "Fiber: above 4g". They want the selected option for favorite fruit 1 to remain "Banana" but the list of options available for favorite fruit 1 and 2 to both contain only fibrous red fruits. (Again, I over simplified it for example. This makes more sense when you have thousands of options). Is there a way to do this?
The layout would be something like this:
<select id="color"></select>
<select id="fiber"></select>
<select id="fruit1" value="1"></select> <!--Bananas is selected-->
<select id="fruit2"></select>
My dataSource would be something like this:
[
{
fruitId: 1,
fruitName: "Banana",
color: "Yellow",
fiber: "below 4g",
potassium: "high"
},
{
fruitId: 2,
fruitName: "Apple",
color: "Red",
fiber: "above 4g",
potassium: "low"
},
...
]
Hi Team,
When a drodpdownlist is loading data, the loading icon (k-input-loading-icon) has a wrong height causing the widget height to change too, resulting in a weird "pumping effect" in the form.
To reproduce, simply look at the dropdownlist demo page :
Any workaround?
Regards,
Laurent.