Hola estoy tratando de aprender a hacer una petición post, utilizando el sencillo ejemplo de abajo. Mientras yo pueda enviar fácilmente los datos a result.php y obtener los resultados a través de un mensaje de alerta que me gustaría devolver los resultados en un div en la página actual en su lugar. La razón de esto es que me gustaría que el usuario vea su nombre aparezca en la pantalla tan pronto como haga clic en el botón. Alguien me puede decir cómo iba a modificar este código para que el resultado de la post muestra en un div en lugar de como un mensaje de alerta? Gracias

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
 $(document).ready(function(){
  $("#searchForm").submit(function(event){
    $.post("result.php",
     {
      name:"Mike"

      },
    function(data,status){
  //alert("Data: " + data + "\nStatus: " + status);
  $('#post-result').append(data);
      });
   });
  });
</script>

<form action="result.php" id="searchForm">
<input type="text" name="name" placeholder="Search..." />
<input type="submit" value="Search" />
</form>

<div id='post-result'></div>
  • Una última pregunta. He añadido un formulario simple para mi código de arriba. Acabo de cambiar el nombre de:»Mike» a largo plazo = $form.find( ‘input[name=»nombre»]’ ).val(),? Gracias de nuevo!
InformationsquelleAutor matt tuman | 2013-07-26

2 Comentarios

  1. 2

    Sólo hay que poner un div en la página y el uso de jQuery, append() colocar los datos en él…

    <div id='post-result'></div>
    
    <script>
    $(document).ready(function(){
        $("button").click(function(){
            $.post("result.php",
                $('#searchForm').serialize(),
                function(data,status){
                    //alert("Data: " + data + "\nStatus: " + status);
                    $('#post-result').append(data);
                }
            );
        });
    });
    </script>

    ACTUALIZACIÓN – como por los comentarios, agregó llamada a serializar el formulario para que el script se publicará el actual formulario de datos para el servidor de enviar.

    • Una última pregunta. He añadido un formulario simple para mi código de arriba. Acabo de cambiar el nombre de:»Mike» a largo plazo = $form.find( ‘input[name=»nombre»]’ ).val(),? Gracias de nuevo!
    • sí, usted puede hacer eso, pero de una mejor manera sería utilizar jquery $.serialize() función para enviar datos de un formulario si sólo desea enviar los datos en el formulario. Voy a actualizar mi respuesta a mostrar cómo…
  2. 2

    Puede hacer que en un montón de maneras diferentes, uno de los cuales podría ser:

    $('#idofdiv').html(data);

    Si reemplazar alert("Data: " + data + "\nStatus: " + status); con el código anterior y sustituir idofdiv con su propia div id se debe trabajar.

    Echar un vistazo a la documentación de jQuery para aprender más acerca de ella (http://api.jquery.com/).

    • Gracias definitivamente voy a retirar la documentación.

Dejar respuesta

Please enter your comment!
Please enter your name here