Telerik Forums
KendoReact Forum
0 answers
119 views

All of the examples that I am finding online and in your documentation are broken for this situation. I am able to customize all columns in my TreeList component EXCEPT the first column which is the expandable one.

I was trying to use the code found on this StackBlitz that works, but it's using an old version of the treelist and I'm using the latest version (7.4.0):

React (forked) - StackBlitz

And I found this in your knowledge base using 5.12 - which doesn't even work:

Defining custom expand/collapse cell - KendoReact TreeList (telerik.com)

(the expandable icon is not showing - which is the behavior I am experiencing in my code).

Is there a known issue with the TreeList currently?

Stephanie
Top achievements
Rank 1
 asked on 01 May 2024
1 answer
421 views

I have a custom button on a Form which invokes a custom Dialog to edit properties of the item on display, that part works fine. However, the Submit button does not enable unless one of properties mapped to a 'Field' controls is edited.

How can I change the allowSubmit value in the Form render properties so the button is enabled when its' only my custom button that is updating the object?

Wissam
Telerik team
 answered on 01 May 2024
1 answer
108 views

Hi,

 

If pass a invalid value to MultiSelect, it will break the UI with null pointer exception. Please see this example:

https://codesandbox.io/p/sandbox/zen-pasteur-fw7rrt?file=%2Fapp%2Fmain.jsx%3A13%2C20

 

This only happens if data is an array of objects, and textField property is used.

It is possible invalid values are passed to multiselect when it is a controlled component. I am hoping MultiSelect can handle data error mor gracefully.

 

Thanks,

Jie

Wissam
Telerik team
 answered on 29 Apr 2024
1 answer
243 views
Hello! I am trying to get a Grid with Virtual Scrolling working where the data is fetched as needed, as opposed to all loaded in at once. I have not managed to get it working locally. All of the documentation I have been able to find has examples with all the data pre-loaded into the React state, which is not feasible in our use case. Would you be able to provide any examples on how this is expected to be done? I have been looking into `onPageChange` and `onDataStateChange` but cannot determine how they are intended to be used here. Is it expected that the new data is returned from these functions? Or is it expected that, once the data is fetched, the overall `data` variable passed into the grid is manipulated (sliced) to only pass in the expected rows given skip and take?
Filip
Telerik team
 answered on 26 Apr 2024
1 answer
252 views

Hello there. We have a grid using the process method to filter rows. We're currently using version 5.16.1, Typescript and wanted know if there was a way to dynamically hide (or show) the column menu filter icons in the header using an external button's onClick function?

In our project, we have columns that are using a custom header cell so filtering is not available on those specific columns. However, we just want to be able to click a button outside of the grid that can toggle the filter icons to show which columns are available to filter at the same time.

Would that be possible?

Konstantin Dikov
Telerik team
 answered on 26 Apr 2024
1 answer
210 views

I am using kendoreact tooltip to show  the error on hovering of cell in the grid. When i hover on the error, i wan to change the height, width, background-color & text color of the tooltip. Please help. i tried to customize using .k-tooltip class. But its not working.  Please help


Konstantin Dikov
Telerik team
 answered on 25 Apr 2024
1 answer
765 views
Hello, I am using a Kendo React DropDownList in a form, but I have an issue. I receive data in batches of 10 from the server-side due to pagination settings. How can I implement scrolling so that the dropdown can display the next 10 data entries when scrolled
Konstantin Dikov
Telerik team
 answered on 25 Apr 2024
1 answer
243 views

Hi!

I'm brand new to this framework and learning a lot so apologies if this is a silly question.

I have created a grid - it has a text column and a chip column that represents the status of the record. I implemented a context menu for the grid rows but it is not triggered on the chip column...just on the text column. How can I fix this?

Here is my code:


 <Grid
        className="custom-grid"
        data={people.slice(page.skip, page.take + page.skip)}
        skip={page.skip}
        take={page.take}
        total={people.length}
        scrollable="none"
        pageable={{
          buttonCount: 3,
          responsive: false,
          pageSizeValue: pageSizeValue,
        }}
        onPageChange={pageChange}
        onContextMenu={handleContextMenu}
      >
        <GridColumn field="PersonName" title="Full Name" />
        <GridColumn
          field="Status"
          title="Status"
          cell={(props) => (
            <ChipCell
              {...props}
              text={props.dataItem['Status']}
              className={props.dataItem['Color']}
            />
          )}
          width="12.5rem"
        />
      </Grid>
      <ContextMenu
        className="custom-context-menu"
        show={show}
        offset={offset.current}
        // onSelect={handleOnSelect}
        onClose={handleCloseMenu}
      >
        <MenuItem text="Option 1" />
        <MenuItem text="Option 2" />
      </ContextMenu>
    </div>

Konstantin Dikov
Telerik team
 answered on 24 Apr 2024
1 answer
119 views

Hello, I'm using Kendo Grid with select drag functionality in a tile layout that has reorderable function.

The problem now is that my tiles begin reordering with drag capabilities when I attempt to select several rows in my grid.

code : Q1u7xf (forked) - StackBlitz

you can see the video here.

https://www.loom.com/share/5ffbe26f35314f2882ec8285f523a067?sid=07a9286c-6e41-46aa-9e71-a64abc1d2558

According to the Kendo jQuery documentation, we may only rearrange the tiles in the header section.

Kendo UI for jQuery TileLayout Documentation - TileLayout reordering - Kendo UI for jQuery (telerik.com)

So, is it possible to rearrange tiles using just the header portion in ReactJS?

 

Konstantin Dikov
Telerik team
 answered on 23 Apr 2024
1 answer
142 views
Which version must one download to get all the translations for these languages "en-US", "fr-CA", "de-DE", and "zh-CN"?

We seem to be missing translations in Canadian French "fr-CA" for "Sort Ascending", "Sort Descending", "And", and "Or".
Wissam
Telerik team
 answered on 23 Apr 2024
Narrow your results
Selected tags
Tags
General Discussions
Grid
Wrappers for React
Charts
Scheduler
Filter 
DropDownList
Form
DatePicker
Styling / Themes
Editor
TreeList
Styling
PDF Processing
ComboBox
Excel Export
Dialog
Input
TreeView
Upload
Drawer
Button
Drag and Drop
MultiSelect
Tooltip
Accessibility
NumericTextBox
Checkbox
Menu
Gantt
DateTimePicker
PDF Viewer
Popup
Window
AutoComplete
DateInput
Sortable
Data Query
Licensing
TabStrip
Drawing
Calendar
Pager 
Labels 
Localization
TimePicker
GridLayout
FontIcon
Animation
PanelBar
TaskBoard
PivotGrid
Card
DropDownButton
Conversational UI 
DateRangePicker
Splitter
Badge 
Security
Slider
Spreadsheet
ContextMenu
MultiViewCalendar
Stepper
MultiColumnComboBox
MultiSelectTree
TextBox
AppBar
File Saver
ListView
MaskedTextBox
RadioButton
Switch
TextArea
Toolbar
DropDownTree
TileLayout
Map
Avatar
Date Math
Gauge
RadioGroup
RangeSlider
Rating
Loader
ExpansionPanel
SvgIcon
Typography
ProgressBar
ScrollView
Popover
StockChart
RadialGauge
Server Components
AIPrompt
Page Templates / Building Blocks
AI Coding Assistant
Chat
ColorGradient
ColorPalette
ColorPicker
Notification
Ripple
Skeleton
ButtonGroup
Chip
ChipList
FloatingActionButton
SplitButton
ActionSheet
Barcode
QR Code
FlatColorPicker
Signature
BottomNavigation
BreadCrumb
StackLayout
Timeline
ListBox
ChunkProgressBar
Sparkline
FileManager
ArcGauge
CircularGauge
LinearGauge
ExternalDropZone
OrgChart
Sankey
VS Code Extension
InlineAIPrompt
SpeechToTextButton
Chart Wizard
Agentic UI Generator
SmartPasteButton
PromptBox
SegmentedControl
+? more
Top users last month
Simon
Top achievements
Rank 2
Iron
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Marco
Top achievements
Rank 4
Iron
Iron
Iron
Grant
Top achievements
Rank 3
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Simon
Top achievements
Rank 2
Iron
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Marco
Top achievements
Rank 4
Iron
Iron
Iron
Grant
Top achievements
Rank 3
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?