Telerik Forums
KendoReact Forum
1 answer
280 views

The DateInput component of the DatePicker widget has been causing our team a few headaches all centering around the format placeholder used on the input. The issues center around:

  1. Integration with our form validation framework is difficult as the widget treats all invalid dates as null, including an "empty" date field.
  2. The format placeholder makes it impossible to copy+paste a date into the DateInput, which is something our users frequently try to do.

The jQueryUI version of the DatePicker component did not try to do the format placeholder functionality. Is there a way to disable this functionality in the react version of the DatePicker and have the Datenput function as a plain text input when typing?

 

Stefan
Telerik team
 answered on 04 Dec 2018
3 answers
150 views

Hi,

I have problem with Editor component when HTML that is edited has a combination of <br/> and <table> tags. 

When user places cursor on <br/> tag and hits Enter few times (for new line) cursor is always returning to the begining of the document.

This is the StackBlitz where problem can be reproduced:

https://stackblitz.com/edit/react-xybam8-kendo-editor-kbx7fx

and this is the video showing the problem:

https://vimeo.com/303234790

 

Thanks,

Zarko

Stefan
Telerik team
 answered on 03 Dec 2018
3 answers
517 views

Hi,

I am trying to apply css class to the Numeric textbox as shown in below 

   <NumericTextBox
type="text"
  className="input-widget"/>

 

somehow it is not working. When I inspect the same in inspector, I found that css is not visible as shown in attached screenshot-1. I tried same with Input control and it is working fine.

 

Can you please help me.

Stefan
Telerik team
 answered on 30 Nov 2018
1 answer
333 views

I am trying to set the formatPlaceHolder prop on a DatePicker component using the CustomFormatPlaceHolder object per the docs at:

https://www.telerik.com/kendo-react-ui/components/dateinputs/datepicker/placeholders/

This does the correct thing in the rendered component, however, setting the formatPlaceHolder with an object causes my tests to fail the prop types check for this component with message:

Warning: Failed prop type: Invalid prop `formatPlaceholder` of value `[object Object]` supplied to `DatePicker`, expected one of ["wide","narrow","short","formatPattern",null].

 

Is there something I am doing wrong here?

Here is my component:

<DatePicker
id="dateOfOccurence"
name="dateOfOccurence"
format="MM/dd/yyyy"
formatPlaceholder={{ month: 'mm', day: 'dd', year: 'yyyy' }}
/>
Stefan
Telerik team
 answered on 30 Nov 2018
2 answers
270 views

I would like to implement the Ctrl+A and Shift+Up Arrow/Down Arrow functionality that is available on the jQuery version of the Multiselect widget.

It seems as though the native React Multiselect widget does not support any props for key presses. Is there a way to handle key press events in the Multiselect? Or, is there are any plan to add the Ctrl+A and Shift+Up Arrow/Down Arrow functionality?

Moises
Top achievements
Rank 1
 answered on 29 Nov 2018
4 answers
264 views

Hi,

I tried several different ways to fix this, but I'm not having any luck. I have a grid with 20 columns. When I add my first grouping (which has a checkbox in the groupTemplateHeader), I have no problem clicking on the checkbox and having it check. If I do a subsequent grouping, when I click on the second grouping, it does not check the checkbox and shifts the grid to left. The second click actually checks the checkbox. I have tried to take out the horizontal scrollbar programmatically when grouping is applied and I have tried to make the table-layout fixed. However, nothing does the trick - it still shifts.

I am not having this issue with grids that have less columns and if I bring down the amount of columns in this grid, it's fine.

I have my code attached - please let me know if you have any questions about the components.

 

Thanks,

Chris

Stefan
Telerik team
 answered on 28 Nov 2018
4 answers
108 views

Hi

I'm Using Asp.net Core 2.1 and Reactjs and i completely copy this example

but Filterable, Sortable dose not work

Rohullah
Top achievements
Rank 1
 answered on 27 Nov 2018
1 answer
317 views
I created a react project and added the react kendo UI, after adding kendo-react-drop-down.
After adding I am getting the following issues.

npm install --save @progress/kendo-react-dropdowns

Errors
[12:37:54] Warning - [webpack] 'dist':
./node_modules/@progress/kendo-react-dateinputs/dist/es/calendar/components/Calendar.js
(Emitted value instead of an instance of Error) Cannot find source file '../../../../src/calendar/components/Calendar.tsx': Error: Can't resolve '../../../../src/calendar/components/Calendar.tsx' in 'E:\projects\sharepoint\node_modules@progress\kendo-react-dateinputs\dist\es\calendar\components'
NonErrorEmittedError: (Emitted value instead of an instance of Error) Cannot find source file '../../../../src/calendar/components/Calendar.tsx': Error: Can't resolve '../../../../src/calendar/components/Calendar.tsx' in 'E:\projects\sharepoint\node_modules@progress\kendo-react-dateinputs\dist\es\calendar\components'
Expected/desired behavior

The project is fine with above errors mentioned above. Trying to remove the errors.
Vladimir Iliev
Telerik team
 answered on 26 Nov 2018
7 answers
629 views

Hi, 

 

I have couple of questions related to grid. Can you please help?

 

  1. Is there any event or attribute to uniquely identify row inside grid? I wanted to check a scenario in which if there are multiple records inside the grid and in one of the row one of the column is empty, then it should highlight it.
  2. Is unit testing possible for Grid using Jest? If yes, Can you please provide sample example?

Regards,

Parag

Stefan
Telerik team
 answered on 22 Nov 2018
1 answer
489 views

Hi,

I need to change to color and shape of points/items in the kendo react scatter chart. The default is circles with different colors but i need to change it to shapes of diamond, square, circle and plus.
Can anyone please provide help in this regard.

Thanks

Stefan
Telerik team
 answered on 20 Nov 2018
Narrow your results
Selected tags
Tags
General Discussions
Grid
Wrappers for React
Charts
Scheduler
Filter 
DropDownList
Form
Styling / Themes
DatePicker
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
Marco
Top achievements
Rank 4
Iron
Iron
Iron
Hiba
Top achievements
Rank 1
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
Max
Top achievements
Rank 1
Veteran
Iron
Alina
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Top users last month
Marco
Top achievements
Rank 4
Iron
Iron
Iron
Hiba
Top achievements
Rank 1
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
Max
Top achievements
Rank 1
Veteran
Iron
Alina
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?