Hi, 

Is it possible to define where the dropdown container (i.e. k-list-container) is appended in the DOM?

By default it is appended at the bottom of the body but I'd like to define where it is appended.

The reason why I need to do this is because I'm using the KendoReact components in a WebComponent (custom element) which is hosted in a shadow-dom for isolation.
The styles are also only loaded within the shadow-dom and are therfore not applied to content on the outside. 

The issue is that the kendo dropdown container is appended outside of the shadow-dom and the scope of the kendo styles.
The dropdownlist component is styled correctly but the dropdown part that is appended to body is not styled.

I've solved this with other components (i.e. modal window) by defining where I want the the container appended with the createPortal method in React.

 

Hello,

Please allow the Form component to submit even if it's not marked as modified internally. I am trying to use the Form within a Stepper workflow, and the Form can have default values based on what they submitted in the previous Step. If they return to the Step with the Form on it, though, and those initial values are not changed while displaying the Form, then the Form internally is not marked as modified, therefor the submit event never fires.

It'd be nice if we could have a boolean to tell the Form if we care to block submission based on modified or not.

Thank you

Hi,

I need to implement two functionality for treelist control

1. Freezing of column and rows

2. Drag and Drop column and rows

We need to customize our exported excel to contain some additional information to the top rows of the excel sheet.

On using 'filterable' option as true in ExcelExport React component, it's getting applied on the first row but we want those filters to come on header values present on the 2nd/nth row in case we have some additional information on the top rows.

<ExcelExport
                    data={data}
                    fileName="Products.xlsx"
                    ref={(exporter) => { this._exporter = exporter; }}
                    filterable={true}
                >

Please refer the attached snapshots for actual and expected results needed from customization.

As in the JQuery version, it would be good to have the option of showing the total of a column's values without having to use grouping aggregates. 

For example i have 10 products with their prices and i would like to see their total cost in a row below the column, without having to use grouping which adds more elements to the Grid.

I'm trying to build this from scratch, but it is not working correctly with the dataState.  Please help!!!

Hi,

 

The new KendoReact Drawer component looks amazing and works like a charm. It would be great if it supported sub-items similar to the PanelBar component. Having sub-items would simplify the development of sidebar navigation with KendoReact.

 

<PanelBarItem title={'About'} route="/about">
    <PanelBarItem title={'Team'} route="/about/team" />
</PanelBarItem>

Regards,

Basel 

Whether the Treelist supports multi column headers ,Nest columns in the columns definition?

 

Like the Grid

https://www.telerik.com/kendo-react-ui/components/grid/columns/headers/

Currently, the onLegendItemHover can be used to detect mouseover event on a legend item.

Suggest adding an event mirroring the mouseout event.

 

Kendo UI for jQuery implements this

https://docs.telerik.com/kendo-ui/api/javascript/dataviz/ui/chart/events/legenditemleave

Existing implementation of Scheduler component has a very limited customization support. To cover some real use-cases we need:

1. Conditionally hide Scheduler Header and Footer. This is possible with CSS, but still makes sense to have props for that.
2. Customize tooltip content when hovering on the event. Currently tooltip is a one line text, but adding support of a larger popups on hover would allow to show additional info associated with that event. Please consider adding a prop to pass custom component for tooltip/popup rendering (similar to how Custom cells work in Kendo Grid)
3. Customize event component. Is there a way to have multiline text in the event component? Currently it is way to limited to show custom content e.g. adding custom icons is impossible.
4. All events in the same group have a same color when displaying. Please consider adding individual color support for each event. This would help to support error states for events.
5. Custom onDelete/onDoubleClick handlers. We would like to have custom implementation of Delete confirmation and Edit form.

Please advise on how to overcome those limitations as a short term solution and consider adding more Scheduler customization abilities to your Roadmap.

Example of highly configurable Scheduler/Timeline component:  https://js.devexpress.com/Demos/WidgetsGallery/Demo/Scheduler/Timelines/React/Light/

It would be great to have a TreeList component similar in appearance and behavior to the jQuery TreeList (https://demos.telerik.com/kendo-ui/treelist/index), but with the kind of support for virtual scrolling built into the native KendoReact Grid component.

A React wrapper exists for the jQuery TreeList, but it still doesn't play nicely with React, and in any case only supports paging for displaying large data sets, which is inherently not intuitive for displaying tree structures where parent / child hierarchies might span multiple pages.

My sense is this native component would basically be the Grid, but with support for hierarchical data, including drag-and-drop re-ordering of parent / child relationships.

Thanks for considering this feature.

Hello,

I would like to make a general feedback after visiting KendoReact website for the first time. I'll expose a lot of wrongs, but keep in mind my goal is to give you insight for improvement, not to bash.

Context : I'm currently curating React UI frameworks for a new long term project within my company. I am a senior software architect seeking some general feelings about a the product (reliability and performance for example) but also very specific : easy layout management and very accomplished components such as Select.

 

Navigation

The documentation website ( https://www.telerik.com/kendo-react-ui/components ) is extraordinarily slow, this is very inconvenient when you're browsing to discover what the kit has to offer.

Accessing sub-section actually change the page, requiring a full reload, which again, is so slow I don't want to click on it. Seriously.
Take https://www.telerik.com/kendo-react-ui/components/dropdowns/multiselect/ for example, to discover all the features, I have to trigger several page load. This is not gonna happen ; I'll leave this. I did leave this. It's the most wanted component for me in my research. I left.

Content

The documentation pages does not expose the available properties of the component, I have to visit every sublink and read every source to find out. This is not ok either. I'm looking for a framework to save time, and this is starting to seriously leech my time.

The source code of the given examples are real. I can copy paste into an empty file, and it will work. This is the good side of the coin. The bad side of the coin is it takes me an, abnormal amount of time to see how the component is structured. That's the only thing that interest me on the first look. If I want deeper understanding and knowledge, yes please provide with a link to stackblitz or whatever so I can play with it, but first I want to see what it looks like.

You use unconventional naming. Look around in the js world, how people call stuff :

A form select is a select, not a dropdown. Within your dropdown menu item you have multi-select but you have to find it first !
A grid is a css grid, not a DataTable.
You have in your menu : Forms, Dropdown Select, Inputs, Upload. All of that is Form. How am I supposed to know if I've seen all form features if everything is spread around ? You also have Chart, Gauge and Drawing.
PanelBar ? Never heard of it. Accordion ? That's my boy.

You also present features that don't belong here, like Excel Export or PDF Processing whereas some basic information are missing such as "does it work well with TypeScript ?" : https://www.telerik.com/kendo-react-ui/knowledge-base/?search=typescript .

 

Features

You have a lot of components, some are very accomplished (i.e. TreeList) and others are quite average, such as Select. Check this competitor component : https://blueprintjs.com/docs/#select. Real world usages. Maybe you can achieve the very same thing with KendoReact, but even if true, I feel you don't understand what I need.

Too few UI framework care about layouts, KendoReact unfortunately is no exception. Layout is not just a box next to another. Layout is ordering content and filtering content depending on the device, it's putting some text over an image, it's making a row of three blocks and make sure they have the same height regardless of their content, it's having a page section that is exactly the size of the visitor's screen ; UIKit is very good at this ( https://getuikit.com/docs/height ). But it's also Special States : empty state ( https://material.io/design/communication/empty-states.html#content ) or result state ( https://ant.design/components/result/ )

 

My overall feeling is the product is disconnected from the environment and dev culture I'm working in.

I know there you gave me an example of how to do this with custom code - is there a reason this can't be built in?   It's important and is a pain to custom implement when using custom editors for the cells

 

Thanks

Michael

Hello, 

I would like to request for the filter component to be supported in the KendoReact suite as it is in the ASP.NET Core UI suite.

One aspect is the hierarchical structure which can support complex filter scenarios but also the support to persist state of a set of filters.

Thank you

Hello,

 

We need to create a DateTime Picker with max and min limit on Date and also Time.

Currently, the range works as of 22/09/2019 5:30 AM to 21/09/2020 5:30 PM, where complete 24 hrs is been selectable.

We need the time range to be restricted per day. For instance, in the above example, it should be 5:30 AM to 5:30 PM per day from 22/09/2019 till 22/09/2020.

 

Thanks in advance.

Create a function callback for the Upload saveUrl.
This will allow for more flexibility when making requests.

Column locked with KendoReact Grid is not locked in the iPhone safari.  It's OK in Chrome phone simulator, but not in mobile. 

 

<Grid
                    style={{ height: '400px', width: '500px' }}
                    data={products}
                    reorderable
                >
                    <Column field="ProductID" title="ID" width="45px" locked />
                    <Column field="ProductName" title="Name" width="250px" />
                    <Column field="Category.CategoryName" title="CategoryName" />
                    <Column field="UnitPrice" title="Price" width="90px" />
                    <Column field="UnitsInStock" title="In stock" width="90px" />
                    <Column field="UnitsOnOrder" title="On order" width="90px" />
                    <Column field="Discontinued" width="120px" locked={true} />
                    <Column field="QuantityPerUnit" title="Additional details" width="250px" />
                </Grid>

Please add toolbar support in the react conversationalui, just like it exists in the jQuery chat component.

We need in our projects a way to add custom action buttons, besides the simple "send" message.

Ie. attach files/images to a message, open emoji picker, etc.

Hello, 

I would like to request the support of the search panel within the grid component same as in ASP.NET Core UI (https://demos.telerik.com/aspnet-core/grid/search-panel)

Thank you

Hi

Please create a React Scheduler component similar to https://demos.telerik.com/aspnet-ajax/scheduler/examples/overview/defaultcs.aspx