Incluyo algunos formularios dentro de una tabla HTML para agregar nuevas filas y actualizar las filas actuales. El problema que tengo es que cuando inspecciono los formularios en mis herramientas de desarrollo, veo que los elementos del formulario se cierran inmediatamente después de abrirse (las entradas, etc., no están incluidas en el formulario).
Como tal, el envío de un formulario no incluye los campos.
La fila de la tabla y las entradas son las siguientes:
<tr>
<form method="post" action="">
<td>
<input type="text" name="job_num">
</td>
<td>
<input type="text" name="desc">
</td>
</form>
</tr>
Cualquier ayuda sería genial, gracias.
html
firebug
html-table
forms
Alex
fuente
fuente
<form>
No se puede poner dentro<tr>
.<tr>
.Respuestas:
No se permite que un formulario sea un elemento hijo de a
table
,tbody
otr
. Intentar poner uno allí tenderá a hacer que el navegador mueva el formulario hasta que aparezca después de la tabla (mientras deja atrás su contenido: filas de tabla, celdas de tabla, entradas, etc.).Puede tener una tabla completa dentro de un formulario. Puede tener un formulario dentro de una celda de tabla. No puede tener parte de una tabla dentro de un formulario.
Use un formulario alrededor de toda la mesa. Luego, use el botón Enviar enviado para determinar qué fila procesar (para ser rápido) o procesar cada fila (permitiendo actualizaciones masivas).
HTML 5 introduce el
form
atributo . Esto le permite proporcionar un formulario por fila fuera de la tabla y luego asociar todo el control de formulario en una fila dada con uno de esos formularios usando suid
.fuente
<form>
dentro de<table>
las normas?Utilice el atributo "formulario" , si desea guardar su marcado:
(* Campos de formulario fuera de la etiqueta <form>)
Ver también los primeros 2 comentarios
fuente
Si desea una "rejilla editable", es decir una tabla como la estructura que le permite realizar cualquiera de las filas una forma, el uso de CSS que imita el diseño de la etiqueta TABLE:
display:table
,display:table-row
, ydisplay:table-cell
.No es necesario ajustar toda la tabla en un formulario ni crear un formulario y una tabla separados para cada fila aparente de la tabla.
Intenta esto en su lugar:
El problema con envolver toda la TABLA en un FORMULARIO es que todos y cada uno de los elementos del formulario se enviarán al enviar (tal vez eso sea lo deseado, pero probablemente no). Este método le permite definir un formulario para cada "fila" y enviar solo esa fila de datos al enviar.
El problema con envolver una etiqueta FORM alrededor de una etiqueta TR (o TR alrededor de un FORM) es que es HTML no válido. El FORMULARIO todavía permitirá enviar como de costumbre, pero en este punto el DOM está roto. Nota: Intente obtener los elementos secundarios de su FORM o TR con JavaScript, puede generar resultados inesperados.
Tenga en cuenta que IE7 no es compatible con estos estilos de tabla CSS y IE8 necesitará una declaración doctype para ponerlo en modo "estándar": (pruebe con este o algo equivalente)
Cualquier otro navegador que admita display: table, display: table-row y display: table-cell debería mostrar su tabla de datos css de la misma manera que si estuviera usando las etiquetas TABLE, TR y TD. La mayoría de ellos lo hacen.
Tenga en cuenta que también puede imitar THEAD, TBODY, TFOOT envolviendo sus grupos de filas en otro DIV con
display: table-header-group
,table-row-group
ytable-footer-group
respectivamente.NOTA: Lo único que no puede hacer con este método es colspan.
Vea esta ilustración: http://jsfiddle.net/ZRQPP/
fuente