score:5
Accepted answer
as the error said, you can't wrap the tbody
tag in a form
tag.
one of the alternatives would be to just wrap the input
tag with the form instead of the entire table.
it would then look like this:
render() {
return (
<tbody>
<tr>
<td classname="ui header">name</td>
<td>
<form>
<input type="text" placeholder="name"/>
</form>
</td>
</tr>
</tbody>
);
}
if you would prefer to have the whole table be within the same form
tag, you will have to wrap the whole table and not just tbody
.
render () {
return (
<form>
<table>
<tbody>
<tr>
<td classname="ui header">name</td>
<td>
<input type="text" placeholder="name"/>
</td>
</tr>
</tbody>
</table>
</form>
)
}
Source: stackoverflow.com
Related Query
- React prevent form submission when enter is pressed inside input
- Remove white spaces from both ends of a string inside a form - React
- React hook form - Field Array inside Dialog (Material UI)
- How to display JSON data inside render as table in React
- Form inside Table in react.js
- React form onSubmit and onClick do not fire when inside Zurb Foundation "Reveal" dialog
- React table rendering in the form of a row
- Stop form from submitting in React Antd Design on press enter key inside FormDecortor Field
- React - Sorting Table Columns Inside a Map() Method
- Condition checking inside antd form of React + Validation needed
- Unable to update the state when button inside table cell clicked , React Ant Design
- React antd design select inside a table
- Submit button working only if div is inside form - React
- React js - useState returns different values inside and outside of a onChange Form function
- How to add a <Field /> when a button is clicked inside a Form with React & Formik?
- Rendering array inside object to a table using react
- React Table - access state values inside Cell functions
- Cannot create React table form using react-jsonschema-form-extras
- Table not rendering properly inside <div> tag in React
- React form not submitting when using button nested inside Link tag
- data undefined in React Hook Form inside a NPM input fields
- How to render matrix table form array in react
- How do I embed a dynamic Dropdown menu inside a table cell in React JS?
- Conditional rendering inside form in React not working
- How to put Link from react router dom inside Material UI table
- How to stop displaying error when data inside text input was set like this: value={value} React Hook Form
- Toggle multiple buttons individually inside a react table
- Radar chart inside a table for multiple users React
- How to render list of users from firestore and display it in a table form on web page using react js?
- Get consolidated data from all the child components in the form of an object inside a parent component : React JS
More Query from same tag
- export place of styled component
- this.context.PropTypes is undefined
- Can someone give a more real-world example where the setState(updaterFunc) function is more useful than the setState(object)?
- data.map is not a function react
- how to update records after drag and drop
- Why the input doesnt work when generated by React
- React + Firebase Storage + File upload and progress display
- React state updates incorrectly
- Deploying to gh-pages with React doesn't render components?
- React and Socket.io
- React Redux - element not rendering on page but React not throwing error
- Particles.js does not cover the entire page but instead it is inside the card component
- Using Axios in useEffect from an external file
- React SVG tag name provided is not valid
- Material UI: Grid does not put select in row
- How to do default sorting in react-table
- SetAll from CreateEntityAdapter do not set the state with react redux toolkit
- Better ways to manipulate classNames and handle clicks in reactjs
- reactJS with IE8 in not working
- Create a new unique ID in React JS after users clicks "submit"
- What does this terminal mean? (using Next.js next/router)
- Why vh works and % doesn't? (height css)
- Actions must be plain objects while using redux thunk
- How secure are protected routes in Reactjs?
- Setting a default value on a react select dropdown that is populated from an API call
- Warning : Assign object to a variable before exporting as module default
- How to make the visited step active?
- Reactjs: Component not rendering
- React & React-router async components mounted multiple times (componentDidMount called many times)
- Ternary operators test case with jest