Telerik Forums
Kendo UI for jQuery Forum
0 answers
119 views

I have downloaded the newest version of kendo ui 2024.2.514 and downloaded the @progress/kendo-svg-icons seperately. I am having an issue with getting the icon to render properly I tried importing using "import * as svgIcons from './@progress/kendo-svg-icons/dist/index.js';" fixed the error of forbidden access. I believe the issue is when related to the import of svgIcons.

If someone could point me in the right direction that would be great.

derrick
Top achievements
Rank 1
 asked on 18 Jun 2024
1 answer
100 views

I have a Kendo UI jQuery grid (2022.2.802) that may have hundreds of rows. Two columns in each row need to be editable dropdownlists. After the user has finished making all of their edits, they will click a button on the page to submit their changes. I don't want an API call every time a user changes something. I want them to actively click a submit button. The data source is a local JavaScript array of objects. I tried just using the template to create the dropdown lists, but due to the number of rows, this slows down the page load too much. I also don't want them to have to click in the cell twice to open the dropdown list. I would prefer that they just click in the cell and it immediately opens the dropdown. How do I solve these issues? 

  1. Have to click twice in cell to open dropdown (solved with edit function)
  2. Sorting name doesn't work since the value has to be an object to make the dropdown work
  3. Selecting "None" throws a console error
  4. Clicking on a cell with "None" automatically selects the first item in the dropdownlist

Here is a Dojo with my attempt but it isn't quite working: 
https://dojo.telerik.com/@dojolee/EJUBijuN

Martin
Telerik team
 answered on 18 Jun 2024
1 answer
121 views

Hi,

I created a heatmap with custom color combination like the code below. My question is, how can I translate it as legend? Thank you.

function createChart() {
            $("#heatmap").kendoChart({
                dataSource: {
                    data: data
                },
                series: [{
                    name: 'Heatmap of IHR scores across regions',
                    type: 'heatmap',
                    xField: 'CapacityNo',
                    yField: 'Region',
                    field: 'AvgScore',
                    tooltip: {
                        visible: true,
                        template: "<b>#=dataItem.Region# - C#=dataItem.CapacityNo# : #=dataItem.AvgScore#</b>"
                    },
                    color: function(rec){
                        if (rec.dataItem.AvgScore > 80) {
                            return "#619621";
                        }
                        if (rec.dataItem.AvgScore > 60) {
                            return "#7cac2b";
                        }
                        if (rec.dataItem.AvgScore > 40) {
                            return "#f9c000";
                        }
                        if (rec.dataItem.AvgScore > 20) {
                            return "#fab000";
                        }
                        return "#de3a2c";
                    }
                }],
                legend: {
                    position: "bottom"
                },
                xAxis: {
                    labels: {
                        rotation: 'auto'
                    }
                }
            });
        }
Nikolay
Telerik team
 answered on 17 Jun 2024
1 answer
159 views

For the KendoForm jQuery control, how do I control the forms method and action attributes.

Does the form default to sending the e.model ?

I don't see any attributes to change the method [get or post,] nor the action url.

 

Nikolay
Telerik team
 answered on 12 Jun 2024
2 answers
1.6K+ views

 var kGrid = jGrid.kendoGrid({
            dataSource: {
                transport: {
                    read: {
                        url: Main.rootUrl(""),
                        dataType: "json"
                    }
                }
            },
            scrollable: false,
            columns: [
                            { field: "Field1", template: template1 },

 { field: "Field2", template: template2 },

{ field: "Field3", template: template3 },

            ],
            dataBound: function (e) {
              /* code */
            }
        }).getKendoGrid();

 

 

Inside a 'tr' of 'k-detail-row' this code is rendering table with empty 'td' of 'k-hierarchy-cell' class and 'td' of  'k-detail-cell' with above grid. How can I remove the 'td' element with k-hierarchy-cell class which is empty. 

Jens Anders
Top achievements
Rank 1
Iron
 answered on 11 Jun 2024
1 answer
129 views

Hello everyone,

I am using PivotGridV2. I want to work with Remote Data. In the examples I have examined, the calls are made using XMLA or OData. How can I adapt the pivotGridV2 component using a JSON service?

Thanks.
Neli
Telerik team
 answered on 11 Jun 2024
0 answers
125 views
to override apply filter function?
Aleksandr
Top achievements
Rank 1
Bronze
Bronze
Veteran
 asked on 10 Jun 2024
1 answer
74 views

like it says, I have an application that absolutely needs the END_DATE highlighted on the YEAR view.
The start date is meaningless - we need to see only the end dates.

Got to be some way to modify the code to use the other date.

Where can I do this?

 

Thx

J

Neli
Telerik team
 answered on 10 Jun 2024
1 answer
157 views

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.

Geraldine
Top achievements
Rank 1
Iron
 answered on 10 Jun 2024
1 answer
173 views

Hi,

I am wondering why on the select event for the Spreadsheet control I am seeing the previous active cell and not the one I just clicked on? Is there any way I can get the cell I last clicked on?

 

The function I am calling from the select event looks like this:


  function onSelect(e) {

    var spreadsheet = e.sender; // Get the Spreadsheet widget
    var selectedCell = spreadsheet.activeSheet().activeCell();


    console.log("on select event the cell value " + selectedCell);

  }
Am I not understanding the select event?

 

Here is a Dojo link with an example:

Calling Read From dataSource Transport: | Kendo UI Dojo (telerik.com)

 

Thanks,

George

George
Top achievements
Rank 3
Bronze
Bronze
Iron
 updated answer on 07 Jun 2024
Narrow your results
Selected tags
Tags
Grid
General Discussions
Charts
Data Source
Scheduler
DropDownList
TreeView
MVVM
Editor
Window
DatePicker
Spreadsheet
Upload
ListView (Mobile)
ComboBox
TabStrip
MultiSelect
AutoComplete
ListView
Menu
Templates
Gantt
Validation
TreeList
Diagram
NumericTextBox
Splitter
PanelBar
Application
Map
Drag and Drop
ToolTip
Calendar
PivotGrid
ScrollView (Mobile)
Toolbar
TabStrip (Mobile)
Slider
Button (Mobile)
Filter
SPA
Drawing API
Drawer (Mobile)
Globalization
LinearGauge
Sortable
ModalView
Hierarchical Data Source
Button
FileManager
MaskedTextBox
View
Form
NavBar
Notification
Switch (Mobile)
SplitView
ListBox
DropDownTree
PDFViewer
Sparkline
ActionSheet
TileLayout
PopOver (Mobile)
TreeMap
ButtonGroup
ColorPicker
Pager
Styling
MultiColumnComboBox
Chat
DateRangePicker
Dialog
Checkbox
Timeline
Drawer
DateInput
ProgressBar
MediaPlayer
ImageEditor
TextBox
OrgChart
Effects
Accessibility
PivotGridV2
ScrollView
BulletChart
Licensing
QRCode
ResponsivePanel
Switch
Wizard
CheckBoxGroup
TextArea
Barcode
Breadcrumb
Collapsible
Localization
MultiViewCalendar
Touch
RadioButton
Stepper
Card
ExpansionPanel
Rating
RadioGroup
Badge
Captcha
Heatmap
AppBar
Loader
Security
TaskBoard
Popover
DockManager
FloatingActionButton
CircularGauge
ColorGradient
ColorPalette
DropDownButton
TimeDurationPicker
ToggleButton
TimePicker
BottomNavigation
Ripple
SkeletonContainer
Avatar
Circular ProgressBar
FlatColorPicker
SplitButton
Signature
Chip
ChipList
VS Code Extension
AIPrompt
PropertyGrid
Sankey
Chart Wizard
OTP Input
SpeechToTextButton
InlineAIPrompt
StockChart
ContextMenu
DateTimePicker
RadialGauge
ArcGauge
AICodingAssistant
+? more
Top users last month
Rob
Top achievements
Rank 3
Bronze
Iron
Iron
Sergii
Top achievements
Rank 1
Iron
Iron
Dedalus
Top achievements
Rank 1
Iron
Iron
Lan
Top achievements
Rank 1
Iron
Doug
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Top users last month
Rob
Top achievements
Rank 3
Bronze
Iron
Iron
Sergii
Top achievements
Rank 1
Iron
Iron
Dedalus
Top achievements
Rank 1
Iron
Iron
Lan
Top achievements
Rank 1
Iron
Doug
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?