html - icon - input text con boton bootstrap

Mostrar múltiples botones de envío de formulario Inline Same line de IE8 en la tabla

Question

Estoy tratando de mostrar dos botones de envío de formulario en la misma línea dentro de una tabla. En IE7, el siguiente código funciona muy bien, sin embargo, en IE8, el botón Eliminar se despliega a la siguiente línea, aunque he declarado que el formulario se muestra en línea. ¿Alguna sugerencia?

Creé una página de prueba básica aquí para mostrar el problema: http://ajondeck.net/test/displayinline.html

Answer 1

Si desea una solución rápida, debe aumentar el tamaño del td usando css.

<td style="width:300px"> 
    <input id="Submit1" type="submit" value="Submit" name="Submit1"/>
    <form id="form2" action="www.test.com/test2" method="post" name="form2">
        <input id="Delete" type="submit" value="Delete" name="Delete"/>
    </form>

Pero lo importante aquí es que este tipo de forma es un hombre terriblemente codificado. Intenta leer sobre divs y css, ¡las tablas son tu peor enemigo!

Espero que lo encuentres útil: http://www.cssdrive.com/index.php/examples/exampleitem/tableless_forms/P30/

Answer 2

Su ejemplo no funciona principalmente porque su HTML no es válido. ¿Abre una td, coloca Submit1 y luego cierra un elemento de formulario? Arregle eso y muchos problemas desaparecerán.

Si quiere dos botones uno al lado del otro, debería poder colocarlos en el mismo contenedor.

Answer 3

No hay nada de malo en usar tablas para el diseño. Creo que toda la multitud "anti-mesa" es solo un montón de snobs 3l33t1st. ;-) Las tablas son universalmente compatibles en TODOS los navegadores. Ellos son de tiempos antiguos. Ellos son estables. Todos los navegadores han renderizado correctamente.

divs y tramos no lo son. Existen diferencias significativas entre, por ejemplo, ff, opera, safari, etc. sobre cómo elementos como los estilos CSS (como "relleno" o "márgenes") se reproducen en la representación de la página.

Acerca de su pregunta:

Un [input type = submit] fuera de un formulario no hará nada. Si quieres un botón fuera de un formulario, puedes intentar jugar con "tipo = botón" y ver dónde te alcanza. ¡Probablemente necesites crear una secuencia de comandos de una acción de JavaScript para que haga tu puja nefasta! ;-)

La otra cosa que puede intentar es borrar el margen del formulario (de forma predeterminada, los formularios tienen márgenes notablemente grandes) y también intentar flotar el FORMULARIO (es decir, estilo = "margen: 0px; flotar: derecho;") o más ...

Answer 4

Prueba lo siguiente porque tuve una situación en la que hice ese trabajo sin tablas ni nada.

//Put this in ur css styling area
.spanFormat
{
  text-align: left;
  display: table-cell;
  min-width: 10px;
  padding-right: 10px;
}

//This is the html that is used to make ur input buttons side by side on two    
//different forms.
<span class="spanFormat">
 <form action="someaction.php" method="post">
  <input type="submit" name="action1" value="somevalue" />
  <input type="hidden" name="param" value="somevalue" />
 </form>
</span>
<span class="spanFormat">
 <form action="someaction2.php" method="post">
  <input type="submit" name="action3" value="somevalue" />
  <input type="hidden" name="param1" value="somevalue" />
 </form>
</span>

Parecía poner mis dos botones en dos formas diferentes uno al lado del otro.

Answer 5

La forma más fácil que encuentro es usar un pequeño CSS en línea (también podría incluirlo como una clase en su hoja de estilo si lo desea) en la etiqueta del formulario, de esta manera:

<form method="post" action="nextPage.html" name="nameForm" style="display:inline;">
<input type="hidden" name="value" value="someValue">
<input type="submit" name="submit" value="Submit">
</form>

Answer 6

pon cada forma en su propio TD.

ex:

<table cellpadding="0" cellspacing="0">
<tr><td>
<form action="action.php" method="post" style="padding: 0; margin: 0">
<input type="submit" value="Submit" name="X1">
</form>
</td><td>
<form action="action.php" method="post" style="padding: 0; margin: 0">
<input type="submit" value="Submit" name="X2">
</form>
</td></tr></table>

etc.

Editar: para ser totalmente claro, también puedes hacer esto con un formulario que encierra toda la tabla. En la página siguiente (es decir, action.php en el código anterior), puede hacer algo como:

if ($_POST[''X2''] == ''Submit''){
    //do stuff
    }

Otra táctica (si tiene varios formularios) es incluir elementos de entrada ocultos y probar los valores de esos, pero a menudo solo necesita saber qué botón presionó el usuario, que es lo que hace el código anterior.