I have a function as 

function () {
return this.get('inputTextvalue') && this.get('inputTextvalue').trim();
}

I want to set to the kendo Observable:
var ko = kendo.observable({
    onEdit: function (e) {
        $(function () {


            var ds= e.container.find('.k-grid').data('kendoGrid').dataSource,
            model.set('inputTextvalue', null);

            model.set('btnEnabled', function () {
             return this.get('inputTextvalue') && this.get('inputTextvalue').trim();
            });
            dataSource.data(model.Data);
        });
    }
});

After selecting a file in kendoUpload two buttons show up: Upload and Clear:

Is it possible to hide those two buttons? I want to do the upload process programmatically.

I already found out that the two buttons are not accessible after initialization of the kendoUpload widget but also not right away after the SELECT event triggers (on selecting a file to be uploaded). I have found a solution waiting some milliseconds in the SELECT event to hide the two buttons:

setTimeout(function() {
    $('k-actions').css('display', 'none');
}, 10);

Is there a more proper way to hide those buttons?

I'm working with KendoUI for JQuery, very latest official version.

Regards

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});
        });

Hello!

I am trying to use ListView with Buttons inside a Tabstrip. I want the user to be able to select an item to view a report.
As part of this list, I want a clickable hamburger button for the user to open up a popover menu for additional settings.

This setup works for all browsers when I do not perform the "filter" function. However on Firefox (only), using this filter function on the ListView causes my Kendo buttons inside the list to suddenly not fire the onClick handlers.

    $("#listView").data("kendoListView").dataSource.filter({      
      filters: [
        { field: "Document_Number", operator: "contains", value: "J82901" }
      ]
    });

On Chrome and Edge, the Kendo buttons work just fine even after this filter. On Firefox however, I notice that the Kendo buttons are unformatted and do not respond to the click events when logging output in the console.

To reproduce the issue, I have provided the following dojo code: Sandbox Code here

Here is a sample image of the output: I have a Tabstrip with a ListView nested within. Each ListView entry has a button attached to it via a template. On click, the button should fire the click handler and print output to the console. (And a popover in the future)

Any help to get this working on Firefox would be greatly appreciated! This is an older version of Kendo UI (Sept 2021).

Thanks.

Hello,

We have upgraded our Kendo jQuery package. The previous version was 2019.1.220 and our latest version is 2023.3.1114. We observed that

• Some classes were changed in the new js say buttons in the kendo grid.
• Some CSS files are removed. (Assuming it is not compatible with the current version.

After upgrading some of our css are not getting applied. Attaching the screenshots for reference. I'm attaching my sample code.

<link href="{{ URL::asset('css/boostrap_v4_alpha.css') }}" rel="stylesheet" type="text/css">
    <link href="{{ URL::asset('kendo/styles/material-main.css') }}" rel="stylesheet" type="text/css">
    <link href="{{ URL::asset('kendo/styles/font-icons/index.css') }}" rel="stylesheet" type="text/css">
    <link href="{{ URL::asset('kendo/styles/bootstrap-main.css') }}" rel="stylesheet" type="text/css">

Hello,

I am upgrading my application to Kendo version 2023.3.1114 and during the upgrade I fell over the fact, that the <span> tags do not show their assigned icons anymore.

I am using the code as explained here in the Basic Usage section: Font Icons - Sass Themes - Kendo UI for jQuery (telerik.com)
<span class="k-icon k-font-icon k-i-calendar"></span>
But the icon is not shown. If I put a text in between the <span> only the text is displayed.

Also the Dojo example, which should show how to display the icon (Font Icons - Sass Themes - Kendo UI for jQuery (telerik.com)), does not work in the Dojo: Kendo UI® Dojo by Progress (telerik.com).
Here the code:

So is this a bug in Kendo? Or am I and the Dojo missing something?

Thank you for a clarification.

Best,
Jeannine

Now that we are supposed to switch to svg icons, away from the font icons, I was wondering if there is an easy way to size the buttons? I use a custom class for the buttons right now and on two of the buttons I am using icons:

They seem to have shrunk. I am guessing this is because of the switch from font icons to the svg icons?

To be honest the icon on the refresh button for v 2020.1.118 disappeared and I had to find a suitable replacement.

So some of the sizing issue for that button might be caused by what icon I picked -- icon: "refresh" didn't seem to produce an icon, so I went with icon "arrowRotateCwIcon".

I just need some sugestions on how to maintain my custom style and get the icons to appear bigger. The style I am using is below:

.submit {
    width: 110px;
    height: 30px;
    padding: 20px 16px 20px 16px;
    border-radius: 4px;
    background-color: #1e98d7;
    box-sizing: border-box;
    box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.35);
    font-family: "Roboto Medium", "Roboto", sans-serif;
    font-weight: 500;
    color: #ffffff;
    text-align: center;
    line-height: normal;
    letter-spacing: 0.4px;
}

    .submit:hover {
        background-color: #0084cf;
        box-sizing: border-box;
    }

    .submit:active {
        background-color: #50a5d5;
        box-sizing: border-box;
    }

Regards,

George

Hi....

Issue is the  icons don't change when clicking the expand/ contract button in the kendo-grid:

In the context of a hierarchical kendo grid,  it used to, in prior versions (2020.1.1118) swapped icons:

•  from + to - if the user desired to expand and show the child rows in a hierarchical table:

 from - to + if the user wanted collapse the child rows and show only the parent rows.

Now as of  version 2023.3.1010:

,,,something is interfering with my code, guessing that some  CSS references have changed.

Here is a DOJO link:

Untitled | Kendo UI Dojo (telerik.com)

If the link doesn't work (I am new to Kendo as of July and I still haven't gotten the hang of saving stuff on the DOJO) , I have attached a text file (with HTML) that the exact code to test in the DOJO.  You might need to stretch the right side that shows the active code to see the button in the header.

Also, the version prior to 2023.3.1010 showed an evil twin :) ... a little plus sign in addition to the default + plus icon... so you might want to go back a version to look at that too.

Can you give me some ideas on how to fix the issue of the icons NOT swapping on the 2023.3.1010 version when it was working fine previously?

Regards,

George

Use case: I have a button that triggers a long-running process.  I would like to add a spinning icon to the button itself to show that the process is already in progress (it has no reason to affect the rest of the page).  

I can add an imageUrl on the fly, however when the process completes, I would like to be able to remove the image, and it does not seem to work.  If I set imageUrl to null or empty string, nothing happens. 

This is not a huge problem as I can write jQuery code to hide the image, I just wondered if there was a simpler way.  

Hello, I am studying a lot because I am using Kendo for JQuery for the first time in this project.

Currently, I am creating a function that registers a favorite for each row of data, and I need to create it as shown in the picture.

The favorite column is assigned a Y/N cutoff value, and the icon changes accordingly.

And when the icon is clicked, the icon should change if the favorite status is successfully switched through ajax communication.

Thanks a lot for all your help!