AllenFang / react-bootstrap-table

A Bootstrap table built with React.js
https://allenfang.github.io/react-bootstrap-table/
MIT License
2.24k stars 782 forks source link

custom multi select warning #2035

Open shorif2000 opened 5 years ago

shorif2000 commented 5 years ago

i have the following code where i only want to show the tick box on certain rows

customMultiSelect(props) {

        const { type, checked, disabled, onChange, rowIndex } = props;
        console.log(rowIndex);
        /*
        * If rowIndex is 'Header', means this rendering is for header selection column.
        */
        if (rowIndex === 'Header' ) {
            if( this.state.statusButton.value == 1){
                return (
                        <div className='checkbox-personalized'>
                          <Checkbox {...props} key={rowIndex}/>
                          <label htmlFor={ 'checkbox-1' + rowIndex }>
                            <div className='check'></div>
                          </label>
                        </div>);    
            }
            return (
                    <div className='checkbox-personalized'>

                </div>);

        } else {

            if(this.state.data[rowIndex].exemption_status_id != 1 || this.state.data[rowIndex].security_engineer != 'Not Assigned'){
                return '';
            }
          return (
            <div className='checkbox-personalized' key={rowIndex}>
              <input
                key={rowIndex}
                type={ type }
                name={ 'checkbox' + rowIndex }
                id={ 'checkbox-1' + rowIndex }
                checked={ checked }
                disabled={ disabled }
                onChange={ e=> onChange(e, rowIndex) }
                ref={ input => {
                  if (input) {
                    input.indeterminate = props.indeterminate;
                  }
                } }/>
              <label htmlFor={ 'checkbox-1' + rowIndex }>
                <div className='check'></div>
              </label>
            </div>);
        }
      }

i seem to keep getting this warning message in the console

main.bundle.js:125022 Warning: Received `false` for a non-boolean attribute `indeterminate`.

If you want to write it to the DOM, pass a string instead: indeterminate="false" or indeterminate={value.toString()}.

If you used to conditionally omit it with indeterminate={condition && value}, pass indeterminate={condition ? value : undefined} instead.
    in input (created by Checkbox)
    in label (created by Checkbox)
    in div (created by Checkbox)
...
...
main.bundle.js:125007 Warning: React does not recognize the `rowIndex` prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase `rowindex` instead. If you accidentally passed it from a parent component, remove it from the DOM element.
    in input (created by Checkbox)
    in label (created by Checkbox)
    in div (created by Checkbox)
    in Checkbox (created by bound customMultiSelect)
...