Me gustaría tener un botón de enviar que presenta un valor diferente de la que se muestra en el botón. Con <input type="submit"> parece que no puede hacer esto. Con <button type="submit"> sin embargo, estos pueden ser dos valores diferentes. La pregunta es, ¿funcionará en todos los navegadores?

Tratando de este código de prueba aquí:

<form method="get" action="">
    <input type="text" name="txt"/>
    <button type="submit" name="btn" value="val">text</button>
</form>

En FF 3.6 actualizaciones de mi barra de direcciones con ambos valores de forma adecuada (y responde a mí pulsar enter en el cuadro de texto). En IE 8, también acepta la tecla enter, se muestra el valor de texto en la barra de direcciones, pero no muestra el botón del valor como un parámetro en todos los… ¿eso quiere decir que no enviarlo?


No los puedo usar oculto entradas porque me necesita para determinar qué botón es pulsado sin JS.


Prueba 2:

<form method="get" action="">
    <input type="text" name="txt"/>
    <button type="submit" name="submit1" value="submit1">submit</button>
    <input type="submit" name="submit2" value="submit2"/>
    <input type="submit" name="submit3" value="submit3"/>
</form>

En IE8, al pulsar la tecla intro no presentar cualquiera de los botones, pero al hacer clic submit1 se enviar un valor. Va a enviar «enviar», no «submit1» que es incompatible con FF. Sin embargo, enviando el formulario sólo se envía el valor de uno botón en ambos navegadores, lo que significa que podría ser capaz de comprobar que botón fue pulsado por comprobar si GET['submitX'] existe en su lugar! Chrome tiene comportamiento ligeramente diferente al pulsar enter (presenta button2). La ópera parece coherente con FF… pero todos 4 los navegadores de sólo enviar un botón. Yo no tengo ninguna de las versiones anteriores de los navegadores instalados, aunque…. ¿alguien sabe si funciona en versiones anteriores, especialmente IE6?

  • No desea utilizar <input type="hidden" /> lugar?
  • No… la idea es que quiero tener múltiples botones de envío en la página, y las necesito para hacer cosas diferentes, sin el uso de JavaScript.
  • para poner a prueba en IE5 e IE6 y si está ejecutando Windows, siempre puedes utilizar IE Tester @ my-debugbar.com/wiki/IETester/HomePage
InformationsquelleAutor mpen | 2010-04-06

6 Comentarios

  1. 11

    Anciano post, pero creo que hay una solución que se ha perdido aquí. El button[type=submit] siempre ha tenido problemas con comportamientos incoherentes, particularmente con el viejo de la IEs, y de @Marcos pruebas parece que todavía tiene problemas.

    Lugar, se puede utilizar dos valores diferentes para la name atributo de la input[type=submit] y analizar estas del lado del servidor para obtener la acción correcta. Por ejemplo, usted puede hacer:

    <form method="get" action="">
        <input type="text" name="txt"/>
        <input type="submit" name="action[do_something]" value="Do Something Cool"/>
        <input type="submit" name="action[do_another]" value="Do Something Dangerous"/>
    </form>

    Sólo el éxito (de clic o por defecto) par nombre-valor se envía así, por ejemplo, en PHP, usted puede fácilmente hacer algo como:

    <?php
    if (isset($_GET['action']['do_something'])) {
        //do something
    } else {
        //do another thing
    }
    ?>

    Nota la acción por omisión siempre será la primera que aparece en la fuente.

    • He tomado este enfoque exacto en el pasado; supongo que estaba buscando un limpiador/más semántica solución, pero al menos esto funciona de forma fiable.
    • Sabes por casualidad para que IE hace el botón[type=submit] se aplican ?
    • Parece que se aplica a IE8 en «Caprichos» de modo. Así que si usted está en IE8 y no se especifica el tipo de documento como (por ejemplo) HTML5 que voy a publicar el texto del botón. Cambiar al modo estándar y voy a publicar el value atributo. Algunas pruebas rápidas con IE6 y IE7 + WinXP mostró el texto de los botones de ser sometido o no de un moderno doctype fue utilizado.
  2. 10

    Aquí es una alternativa si usted no está seguro acerca del uso de un botón de etiqueta.

    <form method="get" action="">
        <input type="text" name="txt" />
        <input type="hidden" name="myinput" value="myvalue" />
        <input type="submit" name="submit" />
    </form>

    Esto será más consistente que el de un botón de etiqueta como algunos navegadores enviar el texto dentro del botón de etiquetas en lugar de su valor de atributo. Por ejemplo

    <button name="mybutton" type="submit" value="one">Two</button>

    En algunos navegadores, tendría «uno» presentado, en otros, «Dos».

    Si quieres actuar de forma condicional, en función del botón pulsado, tendría que hacerlo basándose en el texto de la entrada…

    En este ejemplo, el texto de presentación («Botón 1» o «Botón 2») sería enviado de vuelta.

    Firefox: «?txt=&submit=Botón+1»
    Es decir: «?txt=&submit=Botón+1»
    Safari: «?txt=&submit=Botón+1»

    Y así sucesivamente. Da dos elementos de formulario con el mismo nombre es generalmente aceptado como sea posible como los navegadores la soportan. No es formalmente documentado, aunque, por lo que tendrá que decidir si desea actuar sobre ella.

    Como última alternativa, ¿hay alguna razón por la que no se les puede dar un campo de formulario que vamos a elegir el flujo de control en lugar de tener dos botones?

    <form method="get" action="">
        <input type="text" name="txt" />
        <select name="myname">
            <option value="A">A</option>
            <option value="B">B</option>
        </select>
        <input type="submit" name="submit" value="Go" />
    </form>

    ACTUALIZACIÓN

    Si quieres dos botones para el caso que usted menciona en su comentario… es decir, un botón, la mitad de la forma de actualizar algo basado en un sub-conjunto de entradas y otro botón en la parte inferior para presentar, así es como se deben hacer las cosas…

    1) Los botones deben hacer la misma cosa – sólo tiene que enviar el formulario.

    2) debe detectar en el lado del servidor si usted tiene una forma válida (si están trabajando de forma secuencial y han llegado a la primera de las dos presenta, tendrá entradas en blanco para la segunda mitad de la forma de representación de lo no válido).

    3) debe detectar en el lado del servidor si usted tiene información suficiente para realizar el cálculo o actualización que usted menciona en su comentario.

    En los casos 2 y 3, debe marcar los campos que son necesarios para que el usuario proceda.

    Esto niega la necesidad de particular botones para hacer cosas particulares – el usuario podría escribir en la primera mitad de la forma y todavía pulse el botón en la parte inferior de modo que usted no quiere a la base de su lógica en que se pulsa el botón.

    • Que los golpes. Tanto para los estándares.
    • He añadido alguna información adicional que puede ser de uso basado en su nota sobre el deseo de dos botones. Espero te sirva de ayuda.
    • Sí, quiero a evitar basándose en el texto mostrado. Lo que si quiero que ambas tienen el mismo texto? O ¿qué pasa si el texto es dinámico o contiene caracteres extraños? Prefiero no mezclar la lógica de presentación con código de pruebas (en contra de lo que debería ser un solo display de valor). Buscando una solución flexible… esto va dentro de un marco. No quiero un cuadro de selección, ya sea, que ralentiza a los usuarios hacia abajo 😉
    • El problema no está en las normas, pero que están tratando de imponer un fallo condicional efecto que no es válido de acuerdo a las normas.
    • Tal vez la lógica condicional que nunca fue su intención, pero algunos un comportamiento coherente a través de los navegadores todavía sería agradable. Mi objetivo no es tener los dos botones de hacer cosas diferentes, solo me falta un botón extra en el medio de mi formulario para actualizar la página basada en algunos de los anteriores entradas, ya que JS no siempre está disponible para hacerlo (es decir, hacer un cuadro de selección rellenar un 2do uno). Y para hacer eso sin JS, necesito enviar los datos… pero supongo que sólo puedo comprobar si el campo que me interesa está en blanco o no y hacer que cualquiera de los botones de hacer lo que quiero.
    • He añadido otra actualización basado en sus comentarios.
    • campos ocultos no son una solución
    • por favor explique lo que significa.
    • Lo siento, sí que me lo explique en mayor caso de uso, cuando tu eres el uso de bucle, por ejemplo, en un post de la lista, y desea enviar sólo el valor de los post relacionados. El uso de un único formulario no es más posible con campos ocultos debido a que el valor de cada campo será enviado. El uso de un tipo de entrada botón de enviar un único valor relacionado a la acción es la mejor manera. Porque el trabajo dentro y fuera de un bucle.
    • Si sólo desea enviar la fila del bucle tendría su propia forma. Si desea presentar una lista y una selección hay elementos de formulario diseñado para que la situación exacta (radio/casilla de verificación). Si estás atascado con esto, pregunte a una pregunta por separado en lugar de la adaptación de un niño de 3 años a uno.

  3. 7

    Esto va a hacer el truco en IE

    <button type="submit" name="submit1" value="submit1" onclick="this.value='submit1' ">submit</button>

    Simple y funciona en todos los navegadores

    • Creo que estaba tratando de evitar JS…
  4. 1

    El uso de campos ocultos, son la mejor manera de hacerlo.

    <input type="hidden" value="any value you want to enter" />
    • ¿Cómo que me dan 2 diferentes vals según el botón que he pinchado? Sé que no me haga mi intención explícita en la Q, pero eso es lo que yo busco.
    • agregar más botones, pero cambiar los nombres sólo
    • Ahora que suena como que podría ser una solución real. No es ideal, pero se puede trabajar.
  5. 1

    Esto es lo que he hecho para este problema. Funciona en todos los navegadores.

    <form method="get" action="">
        <input type="text" name="txt"/>
        <input type="hidden" name="btn" id="hiddenbtn" />
        <button type="submit" name="btn1" value="val">text</button>
    </form>

    Javascript (Requiere jQuery):

    $(document).ready( function{
        $(":submit[name='btn1']").on("click", function() {
            $("#hiddenbtn").val($(this).val());
        });
    });
  6. -2

    De no adjuntar los valores de los botones de tipo submit. Un botón del tipo submit envía un formulario. Eso es todo lo que hace y debe aspirar a hacer. Cualquier método de envío de cualquier forma es igual a todos los otros métodos de envío de la misma forma en el propósito y el ámbito de los datos. Lógicamente correcta a la intención de HTML que usted necesita para utilizar distintas formas si quieres datos diferentes para ser condicionalmente devueltos en el momento de la presentación.

    Entiendo que mi respuesta es incómodo, pero es la única respuesta correcta sin agregar y quitar campos de entrada ocultos usando JavaScript.

    • No estoy de acuerdo. Estás argumentando semántica, pero hay veces cuando las reglas de oro de la necesidad de ser roto. HTML en sí es semánticamente defectuosa; fue diseñado como una mezcla de marcado semántico y lógica de presentación, por lo que se preocupa acerca de lo que estaba la intención de? Este es el año 2010! Estoy preguntando sobre lo que obras y es posible, ya que no vivimos en un mundo ideal 🙂
    • A continuación, soporte de Correo de Lenguaje de Marcado de mailmarkup.org
    • MML? No estoy haciendo un formulario de correo electrónico aquí… si nada me gustaría utilizar XML y XSLT.

Dejar respuesta

Please enter your comment!
Please enter your name here