Kendo jQuery: (Firefox) Button onClick does not work in ListView!

1 Answer 33 Views
Button Filter ListView Popover TabStrip Templates
C
Top achievements
Rank 1
C asked on 29 Apr 2024, 09:41 PM | edited on 29 Apr 2024, 09:45 PM

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.

1 Answer, 1 is accepted

Sort by
0
Geraldine
Top achievements
Rank 1
Iron
answered on 10 Jun 2024, 05:13 AM

Hello, 

Here is the some steps-by-steps guide which may help you.

To fix the Kendo UI buttons not firing in Firefox after filtering:

Check Firefox Console: Look for errors in the Developer Tools (press F12).
Reattach Event Handlers: After filtering, re-bind the click events to the buttons.
Update Kendo UI: Consider updating to the latest version for bug fixes.
Contact Telerik Support: They may offer a specific solution for this issue.
Use event delegation to handle button clicks within the ListView:

JavaScript

$(document).on('click', '#listView .k-button', function() {
  // Click event code here
});
Spotify Pie

Hope this info will help you.
Best Regard,
geraldine198

Tags
Button Filter ListView Popover TabStrip Templates
Asked by
C
Top achievements
Rank 1
Answers by
Geraldine
Top achievements
Rank 1
Iron
Share this question
or