Questions on KendoReact Forum

1 answer

241 views

[Solved] Conditionally Rendering Nested Column

When I try to conditionally render a column that's nested, its value cells don't show up (which is correct), but its header cell still shows up (which is incorrect), making the entire header row misaligned with the grid rows -- see example below:

https://codesandbox.io/s/new-https-mt0knv?file=/app/main.jsx

Is there any workaround for this? I've tried cellRender, rowRender, headerCell, and headerClassName to no avail, but maybe I've missed something. Unfortunately, I cannot use CSS display:none on the ".k-header" selector because I have a grouped grid where I need that first column header for the hierarchy, and I'd like to try anything but CSS for this as this seems like a KendoReact (JS) bug in general.

Grid

answered on 23 Mar 2023

1 answer

681 views

Kendo license on on-premise deployed application

Hello team,

I Need some help in understanding the license mechanism when the react application is deployed in client location (on-premise).

Right now the license is put on 'kendo-ui-license.txt' file in the src code.

When the application is bundled , will this license be read and used from 'kendo-ui-license.txt' ? or any other way has to be followed?

or help me understand to use license in product bundling.

Licensing

answered on 22 Mar 2023

1 answer

1.0K+ views

Is it possible to submit Kendo React Form programatically without submit button?

Hi, I would like to ask, if is somehow possible to submit Kendo Form programatically. I checked Form ref and also formRenderProps, but there is not method "submit" (or another) to submit form by the script.

Is it somehow possible? I would like to somehow submit this example form without submit button.

// How to submit this form programatically by the script (without submit button)?
<Form onSubmit={handleSubmit}
                 ref={refForm}
                 validator={formValidator}
                 initialValues={initialValues}
                 render={(formRenderProps) => {
                     return <FormElement>
                         <fieldset className={"k-form-fieldset"}>
                             <div className="mb-3">
                                 <Field name={"title"}
                                        component={ValidatedInput}
                                        label={"group.title"}/>
                             </div>
                             <div className="mb-0">
                                 <T _translateProps={['label']}>
                                     <Field name={"description"}
                                            component={ValidatedTextArea}
                                            label={"group.description"}/>
                                 </T>
                             </div>
                         </fieldset>
                     </FormElement>;
                 }}
    />;

Thanks a lot.

Form

answered on 21 Mar 2023

1 answer

416 views

Save and cancel button inside Datepicker

Hi Team,

I am using kendo react in my project. I need a Datepicker which should open on button click instead of input field with save and cancel button inside Datepicker. I saw this option inside datetimepicker but i don't need time in my calendar.

DatePicker

answered on 21 Mar 2023

1 answer

731 views

Activating Kendo UI License on Build Agent

Ref: npx kendo-ui-license activate

Does this command need to be done for each build or once per build environment?

General Discussions

answered on 20 Mar 2023

3 answers

140 views

Scheduler multiline timeline item

Hello,

I would like to ask if it is possible to show multiline items in timeline view in scheduler. It seems that the height of item is 25px by default. I would like to make it larger as you can see on the attached image.

Thanks

Matus

Scheduler

answered on 20 Mar 2023

1 answer

156 views

Responsive Menu

It appears the Menu component is not responsive. How to make it responsive?

There is a responsivepanel for Kendo Jquery to enable this, is there something similar in KendoReact?

I cannot use the Appbar because of submenus.

Thanks.

Menu

answered on 20 Mar 2023

1 answer

172 views

[Solved] Suppress fullscreen mode of window

Hi.

I have achieved to hide the Fullscreen and Minimize buttons of the Window component but if I double click the title bar, the window still goes to fullscreen mode, even though I set the stage to "DEFAULT". How can I avoid that double clicking on the title bar goes to full screen mode?

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

Thanks!

Greetings,

Bernd

Window

answered on 20 Mar 2023

1 answer

212 views

Form initial values only refreshing once

I have a KendoReact form, it has its own initialValues, and a controlled input field:

 <Form
                        ref={formRef as MutableRefObject<Form>}
                        onSubmit={handleOkButtonClick}
                        initialValues={initialData}
                        key={JSON.stringify(initialData)}
                        render={({ valid, visited }: FormRenderProps) => {
                            return (
                                <FormElement>
                                    <StackLayout gap={1} orientation={'vertical'}>
                                        <StackLayout gap={1} orientation={'vertical'}>
                                            <FieldWrapper>
                                                <Label>
                                                   'Name'      *
                                                </Label>
                                                <Field
                                                    name={'Name'}
                                                    component={InputFormComponent}
                                                    autoFocus={true}
                                                    validator={ValidationWorker.isRequired}
                                                    maxLength={255}
                                                    value={nameOfProfile}
                                                    onChange={(event) => {
                                                        setNameOfProfile(event.target.value);
                                                    }}
                                                />
                                            </FieldWrapper>

when I press on Copy button, new set of initial values need to be populated and inserted in the Name field, basically concatenating the string `- Copy` :

const handleCopyButtonClick = async () => {
        await uiHelper.blockUI(async () => {
            try {
                 await createOssSoProfile();
                setNameOfProfile(nameOfProfile + ` - Copy`);
                setInitialData({ Name: nameOfProfile + ` - Copy`, ...initialData });
            } catch (e) {
                uiHelper.showError(e);
            }
        });
    };

it only refreshed my form values once, so I can already see (name - Copy)

second time I press Copy I expect it to be (name - Copy - Copy)

but it is not reflecting in the form, only in the state

what am I missing?

Dialog

Form