[asvarcasParticipant]

I thank you for your response.
But the documentation and examples are full of jQuery snippets and is incomplete.
Only in the jQuery documentation can i find JqxDataAdapter API reference and is not clear how to use it in React.

I tried:

// prepare the data
        let source =
            {
                datatype: 'json',
                datafields: [
                    {name: 'id'},
                    {name: 'parentid'},
                    {name: 'text'},
                    {name: 'subMenuWidth'}
                ],
                id: 'id',
                localdata: data
            };

// create data adapter.
let dataAdapter = React.createElement(JqxDataAdapter, source);

// perform Data Binding.
dataAdapter.dataBind();

And i get “Warning: React.createElement: type is invalid” error.
I don’t get where to import it from.
I tried with:
import JqxDataAdapter from './assets/jqwidgets/jqxdata.js'; and
import JqxDataAdapter from './assets/jqwidgets/jqx-all.js';

[asvarcasParticipant]

Ok, thank you for your help.

[asvarcasParticipant]

I have the same problem.
I’ve followed the steps here: Create React App with jQWidgets and it doesn’t seems to work.

On the browser I get:

TypeError: Cannot set property ‘originalVal’ of undefined
(anonymous function)
C:/Etriek/Servidores/xampp/htdocs/my-app/src/assets/jqwidgets/jqxcore.js:15

Steps to reproduce:

1.- npx create-react-app my-app

2.- In the src folder add an assets folder with the jqwidgets and the jqwidgets-react folders inside of it (version 6.1).

3.- Finally inside App.js file write your widget code:

    import React, { Component } from 'react';
 
    import JqxDateTimeInput from './assets/jqwidgets-react/react_jqxdatetimeinput';
 
    class App extends Component {
        render() {
            return (
                <div>
                    <h4>My First jQWidgets React Component</h4>
                    <JqxDateTimeInput width={200} height={30} />
                </div>
            );
        }
    }
 
    export default App;

I have npm version 6.1.0.

package.json:

{
  "name": "my-app",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "react": "^16.6.0",
    "react-dom": "^16.6.0",
    "react-scripts": "2.1.0"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": [
    ">0.2%",
    "not dead",
    "not ie <= 11",
    "not op_mini all"
  ]
}

[Author]

Posts