unlike other properties, the cellCss parameters are not passed by name, so to use "value" you must do

Code:

cellCss={(row, value) => ... }

and not

Code:

cellCss={({ value }) => ... }

it's because I have panelStyle={{ height: "auto", maxHeight:"200px" }}

looking at the difference, it still puts the left,top,width styles in, but the calculation for top comes up with a different value.  I'm assuming the "auto" is messing it up. 

I'm adding this to avoid having a large blank space when there's only a couple options in the list, but also prevent a giant list that causes the page to scroll when there's a lot of items.

I would like to apply some formatting to the drop down, like how the "formatter" property works on the jquery easyui-combobox.  I already tried renderItem and it does not get called.  is there some other way

hm, I'm not seeing this behavior, maybe due to the combobox being inside a formfield?  I'll try to make a minimal test case that reproduces what I'm seeing.

when the box is near the bottom of a page, expanding it drops below the visible view area and extends the page down.  using a mouse wheel, the page will not scroll down to bring the whole drop down into view until you scroll to the bottom of the list AND ALSO move the mouse a little.  pointing the mouse outside of the drop down and scrolling closes the drop down, starting the process over.

having it expand UP instead of down when it it's too close to the bottom would be a very nice feature.

when on Dec 2019, clicking the single right arrow the month jumps back to Jan 2019 instead of forward to Jan 2020

that worked, thanks.

I have DataGrid with the selection property selecting a row on load, but the selected row is not in view, any way to make it scroll itself into view? the jquery version seems to do this automatically, at least in one place I'm using it.

got it working, thanks.

this, based on your "AppLayout" example, doesn't seem to be working, what am I missing?

Code:

import React from 'react';
import { SideMenu } from 'rc-easyui';
 
class App extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      title: 'AppLayout',
      width: 200,
      collapsed: false,
      selectedMenu: { text: "Wizard" },
      menus: [
        {
          text: "Forms",
          iconCls: "fa fa-wpforms",
          state: "open",
          children: [
            {
              text: "Form Element"
            },
            {
              text: "Wizard"
            },
            {
              text: "File Upload"
            }
          ]
        },
        {
          text: "Mail",
          iconCls: "fa fa-at",
          selected: true,
          children: [
            {
              text: "Inbox"
            },
            {
              text: "Sent"
            },
            {
              text: "Trash",
              children: [
                {
                  text: "Item1"
                },
                {
                  text: "Item2"
                }
              ]
            }
          ]
        },
        {
          text: "Layout",
          iconCls: "fa fa-table",
          children: [
            {
              text: "Panel"
            },
            {
              text: "Accordion"
            },
            {
              text: "Tabs"
            }
          ]
        }
      ]
    }
  }
  toggle() {
    const { collapsed } = this.state;
    this.setState({
      collapsed: !collapsed,
      width: collapsed ? 200 : 50
    })
  }
  handleItemClick(item) {
    this.setState({ selectedMenu: item })
  }
  render() {
    const { menus, title, width, selectedMenu, collapsed } = this.state;
    return (
      <div>
        <div className="f-column">
          <div className="main-header f-row">
            <div className="f-row f-full">
              <div className="main-title f-animate f-row" style={{ width: width }}>
                <img className="app-logo" src="https://www.jeasyui.com/favicon.ico" />
                {!collapsed && <span>{title}</span>}
              </div>
              <div className="main-bar f-full">
                <span className="main-toggle fa fa-bars" onClick={this.toggle.bind(this)}></span>
              </div>
            </div>
          </div>
          <div className="f-row f-full">
            <div className="sidebar-body f-animate" style={{ width: width }}>
              {!collapsed && <div className="sidebar-user">User Panel</div>}
              <SideMenu 
                data={menus} border={false} collapsed={collapsed} 
                onItemClick={this.handleItemClick.bind(this)}
                selected={selectedMenu}
                ></SideMenu>
            </div>
            <div className="main-body f-full">
              {selectedMenu && <p>{selectedMenu.text}</p>}
            </div>
          </div>
        </div>
      </div>
    );
  }
}
 
export default App;

meaning the underlying <input> or just the numberbox component?

there doesn't seem to be a way set a default selection, or to programatically select an item.  am I overlooking it?

what I'm looking to do is to sync the menu with Router, so when you go directly to a path it is selected in the SideMenu

firstly, the docs don't mention that the form validate() method has a callback with the error list as a parameter, but the examples do show this.

next, this callback errors object only has the rules that are not passed, where the onValidate event's error object has all rules, passed or not, and the rules that passed are each an empty array.

shouldn't these be the same?  it would be convenient if the onValidate event matched the validate() method.

a TextBox in a FormField will fire the Form onChange event with each keystroke.  NumberBox will not.  is this intentional?

I've coded myself into a corner and I don't like my options to get out of it.  how would you do this?

I have a form, and in the middle of that there's a grid.  I want to be able to edit the edit using a popup dialog, and I want the grid to be a reusable  component.

so i've made a component that i pass the grid data, has the popup and all, great.  but the popup won't work because in the DOM a form can't be inside another form.

so how do i get this popup form outside of the main form while keeping the grid+dialog+form a nice reusable component?