Questions on KendoReact Forum

2 answers

150 views

Hi there

I am looking for a way that I can use an odata source as the datasource for an autocomplete input and as the user types it queries the remote datasource to return the filtered results.

Looking at the demos and documentation they all seem to be related to local data sources.

Thanks

Nick

General Discussions

answered on 10 Nov 2020

1 answer

302 views

React RadioButton does not have a tooltip property

When I using a radiobutton component, i want to show the hint like the screenshot image, easy to tell the user what the radionbutton's function. here is my code:
<RadioButton
value="2"
name="radio-email2"
onChange={handleDefaultEmail}
title="set as default Email"
/>
the title property works, but there is a error reported:
TS2322: Type '{ value: string; name: string; checked: boolean; onChange: (event: RadioButtonChangeEvent) => void; tabIndex: number; title: string; }' is not assignable to type 'IntrinsicAttributes & RadioButtonProps & RefAttributes<RadioButtonHandle>'.
Property 'title' does not exist on type 'IntrinsicAttributes & RadioButtonProps & RefAttributes<RadioButtonHandle>'.
It works so it's not a problem as I turning the warning off, just a little bit of advice that may be the RadioButton can include this property to support the tooltip showing when the mouse pointer focus on in the future

General Discussions

answered on 09 Nov 2020

1 answer

123 views

Grid Grouping in Firefox

Is there an issue with grouping a grid when using Firefox?

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

The demo works for Safari, Chrome, and Edge but not in Firefox.

General Discussions

answered on 05 Nov 2020

1 answer

4.0K+ views

Put a React Link Element Inside Your Grid Column - How? Example?

Hello,

I need to stick a React Link element inside a column in your React Grid. I have tried setting the widget on the cell prop as your documentation suggests, but cell is not correctly seen. Do you have a quick example of how I can do this or a link to documentation that is current and correct?

I have your Grid populated with data and in the same column in each row I want to clickable Link element that will navigate to a View page to see the details in a nice form of the row on which the Link was clicked.

Thanks,

Jason

General Discussions

answered on 02 Nov 2020

6 answers

1.7K+ views

React Rich Text Editor Features: How to add math equations to text editor

We are going to telerik rich text editor.

we want add add math and science equations to text editor.

So is there any plugin for that?

General Discussions

answered on 31 Oct 2020

1 answer

312 views

React - Folder upload

Hello.
Is there any way to use the React 'Upload' component to upload a folder with its files?

Well thank you.

General Discussions

answered on 29 Oct 2020

1 answer

68 views

How can i sync the time frame of two charts

Hi,

I just want to know if it's possible to show the same time frame in two charts, this means that if the time frame of one chart is changed the second one update automatically.

I'll post here my code

const GraficoWFP = () => {

return (

<div style={{ paddingLeft: "12,5%", paddingRight: "12,5%" }}>

<div style={{ display: "inline-block", padding: "5px" }}>

<div className="col-6">

<div className="k-card">

<Chart

style={{

height: 450,

width: 500,

cursor: "ew-resize"

}}

pannable={{ lock: "y" }}

>

<ChartTitle text="Afghanistan" />

<ChartLegend position="bottom" orientation="horizontal" />

<ChartTooltip shared={true} render={sharedTooltipRender} />

<ChartValueAxis>

<ChartValueAxisItem title={{ text: "Rainfall (mm)" }} />

</ChartValueAxis>

<ChartCategoryAxis>

<ChartCategoryAxisItem

categories={cat}

crosshair={crosshair}

axisCrossingValue={0 && cat.length}

min={36}

max={72}

justified={!0}

labels={{ content: (item) => { return labels[item.value] } }}

/>

<ChartCategoryAxisItem

categories={totalMonths}

justified={!1}

min={12}

max={24}

/>

</ChartCategoryAxis>

<ChartSeries>

{seriesBar.map((item, idx) => (

<ChartSeriesItem

key={idx}

type="column"

tooltip={{ visible: true }}

data={item.data}

name={item.name}

color={item.color}

/>

))}

</ChartSeries>

</Chart>

</div>

<div style={{ display: "inline-block", padding: "5px" }}>

<div className="col-6">

<div className="k-card">

<Chart

style={{

height: 450,

width: 500,

cursor: "ew-resize"

}}

pannable={{ lock: "y" }}

>

<ChartTitle text="Afghanistan" />

<ChartLegend position="bottom" orientation="horizontal" />

<ChartTooltip shared={true} render={sharedTooltipRender} />

<ChartValueAxis>

<ChartValueAxisItem title={{ text: "Variation from Average" }} />

</ChartValueAxis>

<ChartCategoryAxis >

<ChartCategoryAxisItem

categories={cat}

crosshair={crosshair}

axisCrossingValue={0 && cat.length}

min={36}

max={72}

justified={!0}

labels={{ content: (item) => { return labels[item.value] } }}

/>

<ChartCategoryAxisItem

categories={totalMonths}

justified={!1}

min={12}

max={24}

/>

</ChartCategoryAxis>

<ChartSeries>

{seriesLine.map((item, idx) => (

<ChartSeriesItem

key={idx}

type="line"

tooltip={{ visible: true }}

data={item.data}

name={item.name}

color={item.color}

markers={{ size: 2 }}

/>

))}

</ChartSeries>

</Chart>

</div>

)

}

General Discussions

answered on 28 Oct 2020

1 answer

43 views

Filter Tooltip and avoid to show default html tooltip

When I use the prop filter in a Tooltip like these <Tooltip openDelay={500} position="top" filter={handleTooltip} parentTitle> I would like to avoid to show the default tooltip when handleTooltip function returns false, is there a way to do this? right now this is the behaviour http://g.recordit.co/6r6vrZzgD9.gif but I just want to show kendo tooltip when handleTooltip returns true, otherwise, I don't want to show that default tooltip.

General Discussions

answered on 27 Oct 2020

1 answer

114 views

Does KendoReact Material Theme Package Include Font

Hello,

I am using the Material-UI theme package from Telerik for KendoReact. I've installed the NPM package and I've added the line "import '@progress/kendo-theme-material/dist/all.css';" to my App.tsx file.

Is this all I need to do for the Roboto font or do I still need to add this to my index.html and pull it from Google or another source? Thanks.

Sincerely,

Jason

General Discussions