Question

我需要在表格中放置一个HTML表单。我的代码如下所示

<input style="width:140px;" id="category" type="text" ng-model="Category" ng-change="isAddFormValid()"/>
<input style="width:600px;" id="description" type="text" ng-model="Description" ng-change="isAddFormValid()"/>

我在render() { return ( <form className="ui form"> <tbody> <tr> <td className="ui header">Name</td> <td> <input type="text" placeholder="Name"/> </td> </tr> </tbody> </form> ); }中遇到错误。

console

Answer 1

如错误所述，您无法将tbody标记包装在form标记中。其中一个替代方法是将input标记用表单而不是整个表包装。

它看起来像这样：

render() {
    return (
      <tbody>
        <tr>
          <td className="ui header">Name</td>
          <td>
            <form>
              <input type="text" placeholder="Name"/>
            </form>
          </td>
        </tr>
      </tbody>
    );
}

如果您希望将整个表格放在同一个form标记内，则必须包装整个表格，而不仅仅是tbody。

render () {
    return (
      <form>
        <table>
            <tbody>
              <tr>
                <td className="ui header">Name</td>
                <td>
                    <input type="text" placeholder="Name"/>
                </td>
              </tr>
            </tbody>
        </table>
      </form>
    )
  }

在react.js中的表格内部

1 个答案: