Telerik Forums
KendoReact Forum
2 answers
1.2K+ views
Hello, my ultimate goal here is to be able to reorder columns through my testing suite (Jest, react-testing-library). I am not sure that drag and drop is properly supported in react-testing-library (I could be wrong, pointer events are though). Dragging and dropping columns triggers the onColumnReorder method in the browser which is all I am really trying to do, get onColumnReorder to trigger in my testing suite. Can I do this pragmatically or is there a global event I can trigger to have onColumnReorder be called? Thank you!
Mo
Top achievements
Rank 1
Iron
 answered on 29 Jul 2021
1 answer
166 views
I am exporting the pdf using the drawDOM method and passing the template parameter with header and footer. But my header and footer are not showing at the same time.
Kiril
Telerik team
 answered on 28 Jul 2021
1 answer
362 views

I have an issue with grid with enabled both virtual scroll and selectable.

Version 4.7.0.

Everything works until I change total count of items (total prop).

Real use case here is filtering. I initially display 100 items, everything works both selecting items and virtual scroll.

When I apply filtering on data set and change number of items to e.g. 99, virtual scroll stop working.

This issue does not occur when selecatable.enabled is set to false.

 

Here is a link to simple grid with issue reproduced:

https://stackblitz.com/edit/react-tfjv3e?file=app%2Fmain.tsx

After initial load virtual scroll works. When Apply filters button is clicked, virtual scroll is broken and it does not load new items.

Vladimir Iliev
Telerik team
 answered on 28 Jul 2021
1 answer
470 views

When I try to put a checkbox inside a form element the checkbox does not check and uncheck as expected.  If I just use a Checkbox outside of a FormElement tag it works as expected.  I noticed the first example on this page https://www.telerik.com/kendo-react-ui/components/inputs/checkbox/forms-support/ acts similarly to mine.  Is this a known issue?  Is there a working sample I could use?

 

<Form
onSubmit={handleSubmit}
render={(formRenderProps) => (
<FormElement>
<fieldset className={"k-form-fieldset"}>
<div className="mb-3">
<Field
name={"active"}
component={Checkbox}
label={"Active"}
value={active}
onChange={handleActiveChange}
/>
</div>
</fieldset>
<div className="k-form-buttons">
<button
type={"submit"}
className="btn btn-primary btn-sm"
disabled={!formRenderProps.allowSubmit}
>
Submit
</button>
</div>
</FormElement>
)}

/>

 

 

 

Ina
Telerik team
 answered on 27 Jul 2021
1 answer
161 views
Are the card types broken? When I take a look at the demo page, all the types look the same: https://www.telerik.com/kendo-react-ui/components/layout/card/types/
Stefan
Telerik team
 answered on 23 Jul 2021
1 answer
899 views

Hi,

I am trying to set the tabindex property of a KendoReact form I am developing. The form uses a FieldSet and Fields for the form inputs. Most rendered controls seem to ignore the tabindex property of a field. Normal inputs seem to respect that. However, DatePicker, DropDownList, and AutoComplete seem to ignore the property and set tabindex=0 on the generated output regardless of the index I set.

I have created a stackblitz with a simplified version of the form to show the behavior: https://stackblitz.com/edit/react-ifxfxg?file=src%2FNavMenu.jsx

Using KendoReact v4.7.0 both locally and on stackblitz.

Stefan
Telerik team
 answered on 22 Jul 2021
1 answer
462 views

Is there any example of in-cell editing with sorting, filtering, and virtual scrolling? I can't get virtual scrolling to work with all of these features, but if there is an example I can follow to see where I might be going wrong, I'd love to check it out!

 

Thanks in advance!!

Stefan
Telerik team
 answered on 22 Jul 2021
1 answer
1.4K+ views

Hi,

Is it possible to open the "dropdown" for the AutoComplete component by default when entering the contol (giving it focus/clicking on it)?

So for example: in the samples of the Getting started of the AutoComplete (https://www.telerik.com/kendo-react-ui/components/dropdowns/autocomplete/) that you just click on the control and that it shows all countries instead of only showing those after you start typing?

Regards,

Pieter

Stefan
Telerik team
 answered on 22 Jul 2021
1 answer
255 views

It's also happening in the Kendo demo on this page: (first example) https://www.telerik.com/kendo-react-ui/components/grid/editing/editing-inline/

 

Scroll down to the middle of the grid, click Remove on an item, and the grid will jump up to the top when the row is removed from sight

Stefan
Telerik team
 answered on 22 Jul 2021
1 answer
567 views

Hello. We tried adding the read-only and restrictions props to the numeric text box for Kendo React but this props are not available right now only for Kendo Angular. We need the read-only props in our implementation and also the restriction functionality(the auto correct) as provided for Kendo Angular in the following examples

https://stackblitz.com/run/?file=app/app.component.ts

https://www.telerik.com/kendo-angular-ui/components/inputs/numerictextbox/precision/.

Right now if we enter min={0} and then we enter a value through the keyboard it allow us to insert a negative value that resets to 0 after unfocus. We need to prevent the user from inserting negative numbers as per the functionality in the Kendo Angular. 

How can we achieve this?

Thank you.

Krissy
Telerik team
 answered on 21 Jul 2021
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
LLM Kit
OTP Input
+? 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?