Telerik Forums
KendoReact Forum
1 answer
122 views

as you can see the first item (and the last one), does not start from the most right/left, how can I get rid of that space?

 

 


 

Vessy
Telerik team
 answered on 25 Aug 2022
1 answer
109 views

Hi.

If I use your example for re-ordering grid rows by drag&drop, there are a lot of console warnings showing up:

https://stackblitz.com/run/?file=app%2Fdraggable-row.tsx

I think the issue results from the file drag-handle-cell.tsx where there is a td tag just adding the ...props as attributes which doesn't seem to result in valid HTML.

I'm not sure if this has an impact on the re-ordering because if I simply delete the ...props from the td, it still seems to work. Can you please check and let me know if it's ok to remove the ...props from the td?

Thanks,

Greetings,

Bernd

Konstantin Dikov
Telerik team
 answered on 25 Aug 2022
1 answer
152 views

Is it possible for the drawer component to use Inertia JS instead of react router?

Filip
Telerik team
 answered on 23 Aug 2022
1 answer
124 views

Is there a way to format/create cells that has a sub grid structure (see attached)?

 

Filip
Telerik team
 answered on 23 Aug 2022
1 answer
438 views

Hi.

I am trying to only show the detail (+) button in a grid row if a field has a specific value but I can't make it work. Here is an example:

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

As you can see, the + button in the first row does not get replaced by my new button and also if I click on my button it results in an error.

I found a quite old example from a similar thread here but it was build with a class based component. I tried to do this with my function based approach but obviously I'm missing something.

Thanks for your help!

Greetings,

Bernd

Konstantin Dikov
Telerik team
 answered on 23 Aug 2022
1 answer
1.2K+ views

I see that KendoReact offers a lot of the CSS utility classes like e.g. Tailwind CSS does. I would like to use those for things like flexbox and CSS grid, but also for generic padding and margins and such, in the same way I would with Tailwind.

Is there any documentation for these utility classes somewhere on the site? I cannot seem to find any.

Also, in my IDE (Webstorm) the autocomplete offers classes prefixed with 'k-' but also '!k-' and 'k-i-'. What is the difference between these?

Lastly, would it be possible to use Tailwind instead of KendoReact's utility classes alltogether?

How would I go about removing the classes from KendoReact if I wanted to? (without having to delete all of them by hand from the ...-all.css files)

Or perhaps better yet... is there a general 'kendo-react' way to use flexbox or css grid classes?

Filip
Telerik team
 answered on 22 Aug 2022
2 answers
151 views

Does exists any operator, which is able to filter all data values, where "X includes 1" ?

<script>
var dataSource = new kendo.data.DataSource({
  data: [
    { name: "Jane Doe", birthday: new Date(1983, 1, 1), x: [1, 2]},
    { name: "John Doe", birthday: new Date(1980, 1, 1), x: [2, 3]}
  ],
  filter: { field: "x", operator: "eq", value: 1 }
});
dataSource.fetch(function(){
  var view = dataSource.view();
/* The result can be observed in the DevTools(F12) console of the browser. */
  console.log(view.length); // displays "1"
/* The result can be observed in the DevTools(F12) console of the browser. */
  console.log(view[0]); // displays "Jane Doe"
});
</script>

Thanks a lot for an each help :-)

Filip
Telerik team
 answered on 18 Aug 2022
1 answer
142 views

Hi Team,

When using the scheduler and having the RecurrenceId linked to the start event, the RecurrenceException does not populate the in the updated events callback.

Below example show the data structure of all events refering to the start event id. You can see in the console the recurrenceException has a value but its undefined.

https://stackblitz.com/edit/react-smdyt8?file=app%2Fdata.js

Looking for a recomendation on how to solve this issue?

Regards,

Filip
Telerik team
 answered on 18 Aug 2022
1 answer
631 views

Does exists any Kendo input component, which can be used to enter of keywords/tags?

For example, something like this:
https://www.npmjs.com/package/react-tag-input 

demo.gif

O...or like this:

 

Thanks a lot for an each help :-)

 

 

Filip
Telerik team
 answered on 17 Aug 2022
1 answer
241 views

Hi,

I tried to use the firstFilterProps and the secondFilterProps to get the custom date range. I followed this example:

https://stackblitz.com/edit/react-ma6dmb?file=app%2FcustomFilterUI.jsx

But there is a bug.

firstFilterProps and secondFilterProps can switch places.

Please take a look at the steps I took:

1. I only selected the second filter and then hit the "FILTER" button

2. I reopened the date range filter but the second field is now empty and the value went into the first field

What I saw is that the firstFilterProps can sometimes switch places with the secondFilterProps and that depended on the array itself. So if an array of filters had only a single element it would automatically assume it as the firstFilterProps even if that is not always the case. It would be great if somehow before this it could check and match the same keys firstFilterProps === firstFilterProps, secondFilterProps === secondFilterProps before automatically putting it based on the array length.

Konstantin Dikov
Telerik team
 answered on 17 Aug 2022
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?