or
0 answers
72 views
Messages get overlapp as seen below. I am using KendoReact and React bootstrap. Any solution to fix this please?
Manish
Top achievements
Rank 1
Rank 1
asked
on
22 Dec 2023
1 answer
141 views
Greetings,
I'm having an issue with the Date filter when the grid contains null date values.
I'm currently using the following operators for the Date filter:
{ text: 'grid.filterAfterOperator', operator: 'gt' },
{ text: 'grid.filterBeforeOperator', operator: 'lt' },
{ text: 'grid.filterIsNullOperator', operator: 'isnull' },
{ text: 'grid.filterIsNotNullOperator', operator: 'isnotnull' }The "Is null/Is not null" operators are working but the "Is before/Is after" operators are not filtering out the null values.
Is there a way to fix this? Thanks!
Jason
Konstantin Dikov
Telerik team
answered
on
22 Dec 2023
1 answer
329 views
Using version 7.0.2 for all kendo-react dependencies.
I'm trying to use a custom Input component for a form Field component in order to achieve a custom onBlur functionality, which will set a state variable in parent component of the Field. The following code causes an infinite re-render for the custom input component:
If I move the UserEmailInput component outside of the GroupUser component, the infinite re-render is resolved, but I lose the ability to set a the state variable in GroupUser. I could feasibly use a React Context for this, but I'd prefer to use those as sparingly as possible.
Can anyone advise me on this infinite re-render issue, and how I might be able to mitigate it without moving my custom input field outside of the component where the Field is rendered, and where my state variable needs to be set?
I'm trying to use a custom Input component for a form Field component in order to achieve a custom onBlur functionality, which will set a state variable in parent component of the Field. The following code causes an infinite re-render for the custom input component:
export const User = () => {
const [existingUser, setExistingUser] = React.useState({});
const handleUserResponse = (result: any) => {
if (result.data) {
setExistingUser(result.data[0]);
}
};
const UserEmailInput = (props: FieldRenderProps) => {
React.useEffect(() => {
console.log("UserEmailInput Re-Render");
}, []);
const [value, setValue] = React.useState<string>('');
const emailOnBlur = () => {
fetch(...).then((response: any) => {
console.log(response);
setExistingUser(response.data[0]);
};
};
return (
<FormMaskedTextBox
{...props}
onChange={(e: any) => { setValue(e.value); }}
onBlur={emailOnBlur}
/>
);
};
return (
<div style={{ marginTop: '5px', marginBottom: '5px' }}>
<Card>
//Form component lives in parent component.
<Field
name={"email"}
label={"E-mail:"}
component={UserEmailInput}
validator={[
requiredValidator("E-mail"),
lengthValidator("E-mail", 255),
regexValidator("E-mail", emailRegex)
]}
id="emailID"
/>
</CardBody>
</Card>
</div>
);
};Can anyone advise me on this infinite re-render issue, and how I might be able to mitigate it without moving my custom input field outside of the component where the Field is rendered, and where my state variable needs to be set?
1 answer
94 views
Hi, there are three issue in my demo, please check. and if you find any message please give me replay, Thank a lot.
1. All rows become expanded by default.
2. Click the minus sign. The row detail data is not updated.
3. Group-level expansion does not work properly
Konstantin Dikov
Telerik team
answered
on
20 Dec 2023
1 answer
141 views
Hi Team,
I am trying to implement aggregate in my grid which is written in class component.
I have to display aggregate both at top and bottom(in corresponding column) while doing grouping. I am unable to get "groupFooter as rowtype option while writing cellRender function.
Const cellRender = (tdElement, cellProps) =>{
if(cellProps.rowType==="groupFooter"){
}
}
Konstantin Dikov
Telerik team
answered
on
19 Dec 2023
1 answer
186 views
The error displayed is
ERROR in ./node_modules/@progress/kendo-react-popup/index.mjs
I followed these instructions from https://www.telerik.com/kendo-react-ui/components/getting-started/
npx create-kendoreact-app
Below is my configuration
? What is the name of your project? demoapp
? Do you want to use TypeScript? No
? Do you want to use SASS? Yes
? Which Kendo UI Theme do you want to use?
❯ default
bootstrap
material
after this i entered the directory and performed
npm i npm run start
I get errors like
ERROR in './node_modules/@progress/kendo-react-layout/...'
This is a NEW Project with React 18 and Node 18.15
Vessy
Telerik team
answered
on
18 Dec 2023
1 answer
118 views
I want to show a particular row in red color when same records exists in some other row. I using inline editing.
Konstantin Dikov
Telerik team
answered
on
18 Dec 2023
1 answer
252 views
Hi,
Why can't I use the Grid component inside the Drawer? The scroll disappears, and when scrolling occurs, it happens on the page and not within the grid. I created an example containing two grids. As you can see, the top grid has scrolling, but when inserted inside the Drawer, the scrolling no longer appears
Link
Oq8tmu (forked) - StackBlitz
These display: flex settings are responsible for this. I don't understand why, and what can I do to fix that?
2 answers
152 views
I have a project using KendoUI with NextJS 14 and using Turbo pack, I upgraded to 7.0.1 because it said "now with next support" but I am getting errors like this:
There are types at '/app/apps/myproject/node_modules/@progress/kendo-react-grid/index.d.ts',
but this result could not be resolved when respecting package.json "exports". The '@progress/kendo-react-grid' library
may need to update its package.json or typings.
Vessy
Telerik team
answered
on
15 Dec 2023
1 answer
73 views
Hi team,
we were trying to add plus svg icon in kendo grid row.
1. if there is no record plus should appear to add new record,
2.if there is some data present let say 10 then plus icon should appear after 10th record.
could you please help me with the possible way to implement.
Iam attaching a screenshot just for reference.
Konstantin Dikov
Telerik team
answered
on
15 Dec 2023
