I need to set the initial filter value inside GridColumnMenuFilter.
The problem: initial value applies to filter under title but not apply to filter inside GridColumnMenuFilter.
Code example:
const initialFilter: CompositeFilterDescriptor = {
logic: "and",
filters: [
{
field: "isAdmin",
operator: "eq",
value: true,
},
],
};
const GridColumnMenu = (props: GridColumnMenuProps): JSX.Element => {
return (
<div>
<GridColumnMenuFilter {...props} expanded={true} hideSecondFilter />
</div>
);
};
const columnProps = (
field: string
) => {
return {
field: field,
columnMenu: GridColumnMenu
};
};
<Grid
data={tableData.data}
filterable={true}
filter={initialFilter}
>
<GridColumn
title={"Is Admin>"}
{...columnProps("isAdmin")} />
...
</Grid>
HI,
I have a Dialog with some Kendo controls - something like the attached screenshot.
const onSave = () => {
...
}
{props.visible && (<Dialog title={"Split Audience"} height={{dialogHeight}} width={800} closeIcon={false}>
<Form onSubmit={onSave} render={formRenderProps => <FormElement>
...
<Field name={"SS_"+index} maxLength={55} component={SegmentNameInput} defaultValue={segmentName+'_'+suffixValues[index]}
validator={segmentNameValidator}/>...
</FormElement>
}/>
<DialogActionsBar layout={"end"}><button
className="k-button k-button-md k-rounded-md k-button-solid k-button-solid-primary dialog-save" type="submit">
Save
</button>
</DialogActionsBar>
The issue is that the onSave submit handler never gets invoked. I was wondering if it is because the <Form..> is within the dialog?
Any help would be appreciated.
Hi Team,
We are using kendo react licences version in our web project, we have suddenly some functionality like filtering in grid are stopped working. upon investigate, we found below message in console and we suspect this might be the reason.
License activation failed for @progress/kendo-react-intl
Your license expired on 15/09/2021, 03:34:16, the package was published on 18/01/2022, 19:57:51.
We followed steps documented in below link, but still not showing filter option in grid and keep getting activation fail message. is there something we are missing here?
https://www.telerik.com/kendo-react-ui/my-license/?utm_medium=product&utm_source=kendoreact&utm_campaign=kendo-ui-react-purchase-license-keys-warning
Hi there,
I'd like to turn off even/odd row highlighting for the Grid and use cell border instead. Also I'd like to change row height (smaller then default), rowHeight property doesnt' really help with that.
I can do it by learning kendo css classes and override particular properties for certan classes but... I have many different vendors for different components and it's so a pitty to learn all the css classes hell...
It'd be supper cool to have something like turnOffAlternation and showCellBorder attributes on the Grid.
p.s. I easily predict answer but at least I gave a try :)
[kendo-react-buttons v5.0.1]
It seems that the `Button` component removes the `title` prop, making it empty string when rendered. This prevents Tooltip from working on a Button. Is this intentional?
<Button title="test">Test</Button>
renders
<button title="" class="k-button k-button-md k-button-rectangle k-button-solid k-button-solid-base k-rounded-md"><span class="k-button-text">Test</span></button>
note that title is `title=""`
Full StackBlitz example: https://stackblitz.com/edit/react-2xvipj?file=app/main.jsx
I have copied the exact example source code which works on stack blits but on my app the Chart is only rendering these white dots.
I'm creating a custom listNoDataRender for autocomplete.
I wanted to add link that either redirects or updates the state, see my code below.
Unfortunately, clicking the button doesn't trigger the onClick handler, it only closes the suggestion list.
How do i trigger the onClick handler and not close the suggestion list? TIA!
import * as React from 'react';
import * as ReactDOM from 'react-dom';
import { DropDownList } from '@progress/kendo-react-dropdowns';
const App = () => {
const handleClick = () =>{
// update state or redirect here...
}
const listNoDataRender = (element: React.ReactElement<HTMLDivElement>) => {
const noData = (
<h4 style={{ fontSize: '1em' }}>
<span className="k-icon k-i-warning" style={{ fontSize: '2.5em' }} />
<br /><br />
<button onClick={handleClick}>Did you mean reco..</button>
</h4>
);
return React.cloneElement(element, { ...element.props }, noData);
}
return (
<DropDownList
style={{ width: '300px' }}
data={[]}
listNoDataRender={listNoDataRender}
/>
);
}
ReactDOM.render(
<App />,
document.querySelector('my-app')
);
Hi Team,
I am using select row using checkbox in grid using sample here. https://www.telerik.com/kendo-react-ui/components/grid/selection/
but i also enabled pagination, when i select header checkbox all the items in current page is getting selected, is there way to select all rows in all page in a grid?
Regards,
M. Seenuvasan