Telerik Forums
KendoReact Forum
1 answer
346 views

I'm using KendoUploader with autoUpload=false. When the autoUpload is set to false, on bottom side of uploader is displayed button to upload files manually. I would like to ask, if is possible to hide bottom buttons and somehow call some method/attribute of Upload component to start upload with the script. Is it possible? 

(I would like to start upload after success submit of Kendo Form).

<Upload
                                  autoUpload={false}
                                  batch={false}
                                  multiple={true}
                                  defaultFiles={[]}
                                  withCredentials={false}
                                  saveUrl={"https://demos.telerik.com/kendo-ui/service-v4/upload/save"}
                                  removeUrl={"https://demos.telerik.com/kendo-ui/service-v4/upload/remove"}
                              />

Thanks a lot for each help :-)

Vessy
Telerik team
 answered on 16 Aug 2022
2 answers
165 views
Hi, currently component Pager (https://www.telerik.com/kendo-react-ui/components/datatools/pager/) doesn't allow to display text before dropdown.

Pager now:

What i want to achieve:

Will you consider supporting such an option in the future? 
Kamil
Top achievements
Rank 1
Iron
Iron
 answered on 16 Aug 2022
0 answers
441 views

I just followed the instructions to create a my own new react app that uses telerik reporting viewer, I'v set the rest service and it's working fine , but when I'm trying to load a viewer in the website this error pops up (in the console) , Just followed all the steps in the docs ,and still getting this error , by the way the demo react app works fine for me and loads the report properly 

 

"Uncaught TypeError: perspectiveManager.dispose is not a function
    at Object.dispose (telerikReportViewer.js:8168:1)
    at TelerikReportViewer.dispose (telerik-report-viewer.js:213:1)
    at TelerikReportViewer.componentWillUnmount (telerik-report-viewer.js:105:1)
    at callComponentWillUnmountWithTimer (react-dom.development.js:22852:1)
    at safelyCallComponentWillUnmount (react-dom.development.js:22873:1)
    at invokeLayoutEffectUnmountInDEV (react-dom.development.js:25188:1)
    at invokeEffectsInDev (react-dom.development.js:27351:1)
    at commitDoubleInvokeEffectsInDEV (react-dom.development.js:27321:1)
    at commitRootImpl (react-dom.development.js:26883:1)
    at commitRoot (react-dom.development.js:26682:1)"

function App() {
  let viewer;
  return (
    <div>
      <TelerikReportViewer
        ref={(el) => (viewer = el)}
        serviceUrl="https://localhost:7236/api/reports/"
        reportSource={{
          report: "BarcodesReport.trdp",
          parameters: {},
        }}
        viewerContainerStyle={{
          position: "absolute",
          left: "5px",
          right: "5px",
          top: "40px",
          bottom: "5px",
          overflow: "hidden",
          clear: "both",
          fontFamily: "ms sans serif",
        }}
        viewMode="INTERACTIVE"
        scaleMode="SPECIFIC"
        scale={1.0}
        enableAccessibility={true}
      />
    </div>
  );

"

"

hadi
Top achievements
Rank 1
 asked on 15 Aug 2022
0 answers
375 views
I am trying to modernize my application but at a minimal cost. Rewriting my entire system that I developed on Progress/Openedge since 2001 is something I am trying to run away from, so to speak. In Progress/Openedge, there is a way you can run startup parameter files in batch mode so that they are executed in the background.

I want my user interface to be Kendo UI and be able to pick some input data from the user inputs, save it as a .txt or .csv file, call a Progress ABL via a batch mode in the background, import it into an Openedge table, execute the Progress ABL programs for it, get the outcome and save it as a .txt or .csv, then import the outcome back into Kendo UI for the user to interact with it. I feel this is faster than rewriting all my Progress ABL codes afresh.

Is this scenario achievable?

Regards

Zadock

Zadock
Top achievements
Rank 1
 asked on 13 Aug 2022
1 answer
273 views

Hi,

There is an easy way for setting the prop id on rowRender or I have to do that :

 

rowRender = (trElementdataItem, myId=> {
    const trProps = {

      id: myId,

      ...trElement.props,

 

    };
    return React.cloneElement(trElement, { ...trProps }, trElement.props.children);

  }

Konstantin Dikov
Telerik team
 answered on 08 Aug 2022
1 answer
615 views
When using StockChart, when I want to use the mouse wheel to slide down the page, it will automatically adjust the range of the navigator. and I can't find how to disable this feature.
Vessy
Telerik team
 answered on 08 Aug 2022
1 answer
206 views
For example, in this project, when I click point on the graph and setNumber, refreshChart has been set to false but the chart is still refreshed, and handleChartRefresh is not triggered.


objective-cherry-2jm3h3 - CodeSandbox
Filip
Telerik team
 answered on 08 Aug 2022
1 answer
197 views

I'm following the example for using a treelist

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

One thing I noticed is when I enter a filter term, the match result could be hidden/collapsed in the child of a displayed parent. Is there a good way to auto expand out and highlight the matched rows?

 

Vessy
Telerik team
 answered on 05 Aug 2022
1 answer
392 views

I would like to render a Field component outside the Form render function, is this possible? I would like to leverage the validator prop/logic that comes with the Field component.


const InputValidationWrapper = (fieldRenderProps) => { const { validationMessage, visited, enabledAutoComplete, ...others } = fieldRenderProps; const inputProps = enabledAutoComplete ? others : { ...others, autoComplete: "off" }; return ( <div className="pingora-val-i"> <Input {...inputProps} /> {visited && validationMessage && <Error>{validationMessage}</Error>} </div> ); };

const nameValidator = (value) => (!value ? 'Full Name is required' : '');

const App = () => {

return ( <div> <Field id={'fullName'} name={'fullName'} label={'Full Name'} component={Input} validator={nameValidator} /> </div> ); };


Thanks

Filip
Telerik team
 answered on 05 Aug 2022
0 answers
553 views

Hi.

As the example on the documentation pages still uses react router 4 and I had to struggle a bit to make the Drawer component work with version 6, I thought I'd share an example of a possible solution. It's a little hacky because I send all unknown routes to home but it works. :-) 

Hope this helps somebody.

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

Greetings,

Bernd

 

Bernd
Top achievements
Rank 5
Bronze
Bronze
Bronze
 asked on 03 Aug 2022
Narrow your results
Selected tags
Tags
General Discussions
Grid
Wrappers for React
Charts
Scheduler
Filter 
DropDownList
Form
DatePicker
Styling / Themes
Editor
TreeList
Styling
PDF Processing
ComboBox
Excel Export
Dialog
Input
TreeView
Upload
Drawer
Button
Drag and Drop
MultiSelect
Tooltip
Accessibility
NumericTextBox
Checkbox
Menu
Gantt
DateTimePicker
PDF Viewer
Popup
Window
AutoComplete
DateInput
Sortable
Data Query
Licensing
TabStrip
Drawing
Calendar
Pager 
Labels 
Localization
TimePicker
GridLayout
FontIcon
Animation
PanelBar
TaskBoard
PivotGrid
Card
DropDownButton
Conversational UI 
DateRangePicker
Splitter
Badge 
Security
Slider
Spreadsheet
ContextMenu
MultiViewCalendar
Stepper
MultiColumnComboBox
MultiSelectTree
TextBox
AppBar
File Saver
ListView
MaskedTextBox
RadioButton
Switch
TextArea
Toolbar
DropDownTree
TileLayout
Map
Avatar
Date Math
Gauge
RadioGroup
RangeSlider
Rating
Loader
ExpansionPanel
SvgIcon
Typography
ProgressBar
ScrollView
Popover
StockChart
RadialGauge
Server Components
AIPrompt
Page Templates / Building Blocks
AI Coding Assistant
Chat
ColorGradient
ColorPalette
ColorPicker
Notification
Ripple
Skeleton
ButtonGroup
Chip
ChipList
FloatingActionButton
SplitButton
ActionSheet
Barcode
QR Code
FlatColorPicker
Signature
BottomNavigation
BreadCrumb
StackLayout
Timeline
ListBox
ChunkProgressBar
Sparkline
FileManager
ArcGauge
CircularGauge
LinearGauge
ExternalDropZone
OrgChart
Sankey
VS Code Extension
InlineAIPrompt
SpeechToTextButton
Chart Wizard
Agentic UI Generator
SmartPasteButton
PromptBox
SegmentedControl
LLM Kit
OTP Input
+? more
Top users last month
Simon
Top achievements
Rank 2
Iron
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Marco
Top achievements
Rank 4
Iron
Iron
Iron
Grant
Top achievements
Rank 3
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Simon
Top achievements
Rank 2
Iron
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Marco
Top achievements
Rank 4
Iron
Iron
Iron
Grant
Top achievements
Rank 3
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?