or
1 answer
69 views
Greetings,
I'm currently using the PanelBar with expandMode="single" and I'm trying to set the expanded prop to be dynamic (able to collapse and expand on its own when navigating to a different route through the content link).
When I try to navigate to a different route through the content link, only the selected prop is re-rendered but the expanded prop still stays on the previous route.
Is there a solution for this? Thank you!
Best Regards,
Jason Li
Filip
Telerik team
answered
on
16 Feb 2023
1 answer
82 views
For Kendo-UI there is documentation page which provides information about sass-themes style compatibility
https://docs.telerik.com/kendo-ui/styles-and-layout/sass-themes/compatibility
Is there something similar for kendo-react?
Vessy
Telerik team
answered
on
15 Feb 2023
1 answer
135 views
In below chart I am trying to make all text to show in localized format. Values on category axis and values on tooltip also needs in localized.
Is there any way to convert numbers into localized format or I need to pass localized numbers and text as chart values
Is there any way to convert numbers into localized format or I need to pass localized numbers and text as chart values
Vessy
Telerik team
answered
on
14 Feb 2023
2 answers
112 views
i need to change color of drop-down kendorreact drop-down component.
1. What are the css selectors for version 5.11.0 dropdown
2.Where to update and whats the recommended way to update values of css selectors If i am using it in a component for example test.js.
Should i create seperate test.css file and import in test.js .pls suggest best approach
I tried updating css selectors in index.html file but looks like its getting overwritten by selector from kendo theme default all.css configuration.
Wissam
Telerik team
answered
on
14 Feb 2023
1 answer
121 views
Good afternoon,
I am trying to populate a DropDownList inside a form with a data array.
<Field component={DropDownList}
I am populating "data" with the dataset, textField with the label data, and dataItemKey with the Ids. Am I missing something?
Thanks
Wissam
Telerik team
answered
on
13 Feb 2023
1 answer
217 views
Hi,
can anyone help with this problem?
https://www.telerik.com/kendo-react-ui/components/treeview/expansion/expanding-all/
I need to expand all items by default in treeview, but it does not work for nested hierarchy. I tried this example, but it does not work for nested json.
For example if i have sometnig like this, it does not show element 'a'?
const tree = [{
text: 'Item1',
items: [{
text: 'Item1.1'
}, {
text: 'Item1.2',
items:[{text:'Item a'}]
}]
}, {
text: 'Item2',
items: [{
text: 'Item2.1'
}, {
text: 'Item2.2'
}]
}];
Vessy
Telerik team
answered
on
08 Feb 2023
1 answer
185 views
I've stubbed out a master/detail grid that's very simple - 4 columns in the main grid and 3 in the detail grid. When I render the master grid without an associated detail grid via the detail property, it renders fine. However when I set the detail property on the grid, in addition to the first plus/minus hierachy column, the next column header is blank all the column headers are pushed one column over. Not sure if this is a configuration that I'm missing, but I am getting some next-js rehydration errors around the grid with styles, which I'm not sure how to resolve exactly. Anyway I've attached a screenshot and associated code, if by any chance anyone has seen this before and can assist it would be greatly appreciated.
Ivaylo
Telerik team
answered
on
08 Feb 2023
1 answer
79 views
Working on a grid which has a Detail view using an expand field. This results in a weird extra TH tag in the header like the following:
The code for rendering is the following:
return (
<Grid
data={data?.map((item) => ({
...item,
expanded: item?.id === expandedId,
}))}
dataItemKey="id"
expandField="expanded"
onExpandChange={onExpandChange}
detail={FeaturesGrid}
editField="inEdit"
>
<GridToolbar className="!items-end">
<ToolbarSpacer />
<FloatingLabel
label="Context name"
editorId="context-id"
editorValue={name}
className="text-gray-500"
>
<TextBox
id="context-name"
value={name}
onChange={(event) => setName(event.value as string)}
/>
</FloatingLabel>
<ToolbarItem>
<Button
icon="add"
title="Add"
onClick={addRecord}
themeColor="success"
disabled={
!name || data?.find((item) => item?.name === name) !== undefined
}
>
Add
</Button>
</ToolbarItem>
</GridToolbar>
<GridColumn width="55" title="Default" field="default" editor="boolean" />
<GridColumn field="name" title="Name" />
<GridColumn
field="featuresAggregate.count"
title="# Features"
width={100}
editable={false}
/>
<GridColumn
cell={ActionCell}
width={55}
title="Action"
editable={false}
/>
</Grid>
);Is there something I am doing wrong?
I removed the Toolbar and all other noise, but to no avail.
Used versions are:
"@progress/kendo-data-query": "^1.6.0",
"@progress/kendo-drawing": "^1.17.2",
"@progress/kendo-licensing": "^1.3.0",
"@progress/kendo-react-animation": "^5.9.0",
"@progress/kendo-react-buttons": "^5.9.0",
"@progress/kendo-react-charts": "^5.9.0",
"@progress/kendo-react-conversational-ui": "^5.9.0",
"@progress/kendo-react-data-tools": "^5.9.0",
"@progress/kendo-react-dateinputs": "^5.9.0",
"@progress/kendo-react-dialogs": "^5.9.0",
"@progress/kendo-react-dropdowns": "^5.9.0",
"@progress/kendo-react-editor": "^5.9.0",
"@progress/kendo-react-excel-export": "^5.9.0",
"@progress/kendo-react-form": "^5.9.0",
"@progress/kendo-react-gantt": "^5.9.0",
"@progress/kendo-react-gauges": "^5.9.0",
"@progress/kendo-react-grid": "^5.9.0",
"@progress/kendo-react-indicators": "^5.9.0",
"@progress/kendo-react-inputs": "^5.9.0",
"@progress/kendo-react-intl": "^5.9.0",
"@progress/kendo-react-labels": "^5.9.0",
"@progress/kendo-react-layout": "^5.9.0",
"@progress/kendo-react-listbox": "^5.9.0",
"@progress/kendo-react-listview": "^5.9.0",
"@progress/kendo-react-notification": "^5.9.0",
"@progress/kendo-react-pdf": "^5.9.0",
"@progress/kendo-react-pivotgrid": "^5.9.0",
"@progress/kendo-react-popup": "^5.9.0",
"@progress/kendo-react-progressbars": "^5.9.0",
"@progress/kendo-react-ripple": "^5.9.0",
"@progress/kendo-react-scheduler": "^5.9.0",
"@progress/kendo-react-sortable": "^5.9.0",
"@progress/kendo-react-tooltip": "^5.9.0",
"@progress/kendo-react-treelist": "^5.9.0",
"@progress/kendo-react-treeview": "^5.9.0",
"@progress/kendo-react-upload": "^5.9.0",
"@progress/kendo-theme-bootstrap": "^5.12.0",
"@progress/kendo-theme-default": "^5.12.0",
"@progress/kendo-theme-material": "^5.12.0",
Ivaylo
Telerik team
answered
on
08 Feb 2023
1 answer
239 views
Hi,
can anyone provide example how to color text in treeview in react according to database response.
For example,if trans is equal to 10 all elements that have trans equal to 10 will be colored to red..
In this example 'Furniture' will be colored in color red, or if trans is equal to 30 'aaa' will be colored in blue for example
const tree = [{
text: 'Furniture',
trans:10,
items: [{
text: 'Tables & Chairs',
trans:20,
}, {
text: 'Sofas',
trans:50,
}, {
text: 'Occasional Furniture',
trans:50,
}]
}, {
text: 'Decor',
trans:50,
items: [{
text: 'Bed Linen',
trans:50,
items:[{text:'aaa', trans:30}]
}, {
text: 'Curtains & Blinds',
trans:50
}, {
text: 'Carpets',
trans:50
}]
}];
Wissam
Telerik team
answered
on
07 Feb 2023
1 answer
150 views
Greetings,
I'm trying to use the Kendo menu with contentRender so I could render a custom icon component like FontAwesomeIcon.
I'm currently having issue with binding the data to each item when using the contentRender property.
Is there any way to fix this? Thanks!
Regards,
Jason Li
