Formulario HTML hacer algo de "acción" al presionar el botón enviar

Me gustaría aprender sobre los formularios HTML. Por ejemplo, tengo 2 campos de texto de entrada para el nombre y apellido y un botón de enviar. Cuando se hace clic en el botón Enviar, me gustaría que la página web muestre algo así como: Su nombre es "Nombre" "Apellido".Formulario HTML hacer algo de "acción" al presionar el botón enviar

<!DOCTYPE html> 
<html> 
    <body> 
     <form> 
     First name: <input type="text" name="firstname" /><br /> 
     Last name: <input type="text" name="lastname" /><br /> 
     <input type="submit" value="Submit" /> 
     </form> 
    </body> 
</html>

¿Qué necesito tener aquí para tener algo de "acción" cuando hago clic en ese botón?

Edit: Ok ahora me doy cuenta de que necesito PHP o JavaScript aquí. ¿Puede alguien sugerir o proporcionar un código de muestra de PHP o Js como referencia para mí?

Fuente

2012-06-12 Ronaldinho Learn Coding

Su ''

bien, gracias. Investigaré al respecto. –

Bien, voy a echar un vistazo a esto. Si desea trabajar con PHP, deberá instalar y configurar tanto PHP como un servidor web en su máquina. Este artículo podría ayudarlo a comenzar: PHP Manual: Installation on Windows systems

Una vez que haya configurado su entorno, puede comenzar a trabajar con formularios web. Directamente del artículo: Processing form data with PHP:

Para este ejemplo, deberá crear dos páginas. En la primera página crearemos un formulario HTML simple para recopilar algunos datos. He aquí un ejemplo :
<html> 
<head> 
<title>Test Page</title> 
</head> 
<body> 
    <h2>Data Collection</h2><p> 
    <form action="process.php" method="post"> 
     <table> 
      <tr> 
       <td>Name:</td> 
       <td><input type="text" name="Name"/></td> 
      </tr> 
      <tr> 
       <td>Age:</td> 
       <td><input type="text" name="Age"/></td> 
      </tr> 
      <tr> 
       <td colspan="2" align="center"> 
       <input type="submit"/> 
       </td> 
      </tr> 
     </table> 
    </form> 
</body> 
</html> 
Esta página le enviar los datos de nombre y la edad a la página process.php. Ahora vamos a crear process.php utilizar los datos del formulario HTML que hicimos:

<?php 
    print "Your name is ". $Name; 
    print "<br />"; 
    print "You are ". $Age . " years old"; 
    print "<br />"; $old = 25 + $Age; 
    print "In 25 years you will be " . $old . " years old"; 
?>

Como de su conocimiento, si dejar de lado el método = parte "posterior" de la forma , la URL con mostrar los datos. Por ejemplo, si su nombre es Bill Jones y usted tiene 35 años, nuestra página process.php aparecerá como http://yoursite.com/process.php?Name=Bill+Jones&Age=35 Si lo desea, puede cambiar manualmente la URL de esta manera y la salida cambiará en consecuencia.

JavaScript adicional Ejemplo

Este ejemplo solo archivo toma el código HTML de su pregunta y ata el evento onSubmit de la forma a una función JavaScript que tira de los valores de los 2 cuadros de texto y los muestra en una caja de alerta.

Nota: document.getElementById("fname").value obtiene el objeto con la etiqueta ID que es igual fname y luego tira es value - que en este caso es el texto en el cuadro de texto Nombre.

<html> 
    <head> 
    <script type="text/javascript"> 
    function ExampleJS(){ 
     var jFirst = document.getElementById("fname").value; 
     var jLast = document.getElementById("lname").value; 
     alert("Your name is: " + jFirst + " " + jLast); 
    } 
    </script> 

    </head> 
    <body> 
     <FORM NAME="myform" onSubmit="JavaScript:ExampleJS()"> 

      First name: <input type="text" id="fname" name="firstname" /><br /> 
      Last name: <input type="text" id="lname" name="lastname" /><br /> 
      <input name="Submit" type="submit" value="Update" /> 
     </FORM> 
    </body> 
</html>

Fuente

2012-06-13 00:31:09 xelco52

¡Hola! ¡Gracias! Muy buena explicación! Tengo un host en línea y un servidor web listos. Leeré y probaré tu ayuda. Solo necesito que revises aquí y me ayudes más :) –

Tengo una idea con PHP, en este caso, es posible que desee algo más simple como solo un archivo HTML, así que sé que tengo que tener algún tipo de función de JavaScript en etiqueta, puedes ayudarme? –

Agregué un ejemplo de JS al final de mi respuesta – xelco52

índice.html

<!DOCTYPE html> 
<html> 
    <body> 
     <form action="submit.php" method="POST"> 
     First name: <input type="text" name="firstname" /><br /><br /> 
     Last name: <input type="text" name="lastname" /><br /> 
     <input type="submit" value="Submit" /> 
     </form> 
    </body> 
</html>

Después de que una mayor archivo de la página que desea mostrar después de pulsar el botón de enviar

submit.php

<html> 
    <body> 

    Your First Name is - <?php echo $_POST["firstname"]; ?><br> 
    Your Last Name is - <?php echo $_POST["lastname"]; ?> 

    </body> 
</html>

Fuente

2015-10-30 06:07:46

Formulario HTML hacer algo de "acción" al presionar el botón enviar

Respuesta

Cuestiones relacionadas