javascript - Removing row from table results in TypeError -

i have reactjs html table component , update content (cell values) setstate method. here basic code:

 var cell = react.createclass({   render: function () {     return (<td>{this.props.cellvalue}</td>);       }     });   var row = react.createclass({   render: function () {      return (<tr>{this.props.row}</tr>);    }   });  var table = react.createclass({   getinitialstate: function() {     return {       data: this.props.data     };   },   render: function () {     return (       <table>       {         this.state.data.map(function(row) {           var r = row.map(function(cell) {             return <cell cellvalue={cell}/>;           });            return (<row row={r}/>);         })       }       </table>      );   }}); 

you use this:

var initialdata = [[1,2,3],[4,5,6],[7,8,9]]; var table = react.rendercomponent(   <table data={initialdata} />,   document.getelementbyid('table') ); 

this working of time. can change data doing (somewhere in function or whatever):

var newdata = [[1,2,3],[4,5,6],[7,8,9],[10,11,12]]; table.setstate({data : newdata}); 

as can see, adds 1 row end of table. however, if try set initial data after update or in way shorten number of rows setting data smaller array (e. g. [[1, 2, 3], [4, 5, 6]] should remove last row):

table.setstate({data : initialdata}); 

i error:

typeerror: updatedchildren[j] undefined updatedchildren[j].parentnode.removechild(updatedchildren[j]);

where come from?

some browsers (tested firefox , chrome) add automatically <tbody>...</tbody> tags html table not have them. adding them in table component fix issue:

render: function () {     return (       <table><tbody>       {         ... same code before ...       }       </tbody></table>      ); 

if @ html code generated react, can notice adds data attributes (data-reactid) html tags rendered react component (to more info data attribute in general: go here). since <tbody>...</tbody> tags not react component, did not have data-reactid , these attributes react track dom nodes.

anyway, thank these people talked issue. here link https://groups.google.com/forum/#!topic/reactjs/nls-pdrddma.

more data-reactid: https://groups.google.com/forum/#!topic/reactjs/ewtn-wop1w8.