elhacker.net cabecera Bienvenido(a), Visitante. Por favor Ingresar o Registrarse
¿Perdiste tu email de activación?.

 

 


Tema destacado: Introducción a Git (Primera Parte)


+  Foro de elhacker.net
|-+  Programación
| |-+  Desarrollo Web (Moderador: #!drvy)
| | |-+  formulario html
0 Usuarios y 1 Visitante están viendo este tema.
Páginas: [1] Ir Abajo Respuesta Imprimir
Autor Tema: formulario html  (Leído 2,823 veces)
datab

Desconectado Desconectado

Mensajes: 45


Ver Perfil
formulario html
« en: 21 Marzo 2015, 06:25 am »

Buenas noches un consulta tengo un formulario en
https://dl.dropboxusercontent.com/u/33001930/Ventas.html

Como puedo hacer para que cada vez que inserto datos estos me aparezcan abajo en una tabla, y cuando salga del formulario y vuelvo a ingresar estos desaparezcan.

Mod: No escribas en mayúsculas


« Última modificación: 21 Marzo 2015, 09:05 am por engel lex » En línea

engel lex
Moderador Global
***
Desconectado Desconectado

Mensajes: 15.514



Ver Perfil
Re: FORMULARIO HTML
« Respuesta #1 en: 21 Marzo 2015, 08:18 am »

que sabes de php, y manejo de variables get y post?

porque lo que tienes que hacer es iniciar una session en php, e ir guardando un array con los valores de usuario que le vayas pasando por post o get...

en si defecto y la manera simple es jscript e igual tienes que guardar todo en un script y reescribir el DOM cada vez que le des al boton


En línea

El problema con la sociedad actualmente radica en que todos creen que tienen el derecho de tener una opinión, y que esa opinión sea validada por todos, cuando lo correcto es que todos tengan derecho a una opinión, siempre y cuando esa opinión pueda ser ignorada, cuestionada, e incluso ser sujeta a burla, particularmente cuando no tiene sentido alguno.
Reina_Negra

Desconectado Desconectado

Mensajes: 30



Ver Perfil
Re: formulario html
« Respuesta #2 en: 21 Marzo 2015, 12:07 pm »

Ahora que tienes el planteamiento del formulario, utiliza un archivo nuevo donde se almacenen los datos en PHP, utiliza un get en el primer archivo tipo:
Código
  1. <form method="get" action="dondesealmacenandatos.php">

Saludos.
« Última modificación: 21 Marzo 2015, 12:52 pm por #!drvy » En línea

Quien te odia es porque un día quiso ser como tú y no pudo.
Usuario Invitado


Desconectado Desconectado

Mensajes: 625



Ver Perfil
Re: formulario html
« Respuesta #3 en: 21 Marzo 2015, 21:24 pm »

¿Conforme añades registros se muestren en una tabla? ¿Con o sin BBDD? Asumo que es sin BBDD por la simpleza de tu enunciado. Te pondré un ejemplo en mi malísimo PHP xD, porque el 99% de los temas en "Desarrollo web" son en PHP (casi no veo Java EE, Python o Ruby).

index.html

Código
  1. <section class="panel">
  2.    <section class="panel-head">
  3.        <span class="panel-title">Insertar registros</span>
  4.    </section>
  5.  
  6.    <section class="panel-body">
  7.        <input id="id" name="id" class="txt txt-id" placeholder="ID del producto"/>
  8.        <input id="name" name="name" class="txt txt-name" placeholder="Nombre"/>
  9.        <input id="description" name="description" class="txt txt-description" placeholder="Descripción"/>
  10.        <input id="price" name="price" class="txt txt-price" placeholder="Precio"/>
  11.        <button id="insert" class="btn btn-primary">Insertar</button>
  12.        <button id="clean" class="btn btn-default">Limpiar</button>
  13.    </section>
  14. </section>
  15.  
  16. <section class="table-wrapper">
  17.  
  18. </section>

script.js

Código
  1. window.addEventListener("load", init);
  2.  
  3. function init() {
  4.    var txtId = document.querySelector(".txt-id");
  5.    var txtName = document.querySelector(".txt-name");
  6.    var txtDescription = document.querySelector(".txt-description");
  7.    var txtPrice = document.querySelector(".txt-price");
  8.    document.querySelector("#insert").addEventListener("click", handleInsert);
  9.  
  10.    function handleInsert() {
  11.        var formData = new Object();
  12.        formData["id"] = txtId.value;
  13.        formData["name"] = txtName.value;
  14.        formData["description"] = txtDescription.value;
  15.        formData["proce"] = txtPrice.value;
  16.  
  17.        sendByAjax(formData);
  18.    }
  19.  
  20.    function sendByAjax(data) {
  21.        var request = nre XMLHttpRequest();
  22.        request.open("POST", "/insert-product", true);
  23.        request.addEventListener("readystatechange", function() {
  24.           if(request.readystatechange != 4 || request.status != 200) {
  25.               // en caso de error, devolver algo del backend
  26.               alert(request.responseText);
  27.           } else {
  28.               // en caso de exito, el backend devuelve la tabla con todos los elementos
  29.               document.querySelector(".table-wrapper").innerHTML = request.responseText;
  30.               resetForm();
  31.           }
  32.        });
  33.        request.send("data="+data);
  34.    }
  35.  
  36.    function resetForm() {
  37.        txtId.value = "";
  38.        txtName.value = "";
  39.        txtDescription.value = "";
  40.        txtPrice.value = "";
  41.        txtId.focus();
  42.    }
  43.  
  44. }

insert.php

Código
  1. <?php
  2. /** insert.php
  3.  * @Description This script store the new record into user session
  4.  * and return the table with all products
  5.  */
  6.  
  7. if(!isset($_SESSION))
  8.    session_start();
  9. if(!isset($_SESSION["products"]))
  10.    $_SESSION["products"] = array();
  11.  
  12. // convierte el JSON a array asociativo
  13. $data = json_decode($_POST["data"], true);
  14. array_push($_SESSION["products"], $data);
  15. echo "/path/to/table.php"; // devuelve la tabla actualizada

table.php

Código
  1. <?php
  2. /** table.php
  3.  * @Description This script create a table with all store products
  4.  */
  5.  
  6. if(!isset($_SESSION))
  7.    session_start();
  8. var $products = NULL;
  9. if(!isset($_SESSION["products"]))
  10.    $products = $_SESSION["products"];
  11.  
  12. if (!is_null($products)) {
  13.    echo "<table>".
  14.    echo "<thead>".
  15.    echo "<tr>".
  16.    echo "<th>ID</th>".
  17.    echo "<th>Nombre</th>".
  18.    echo "<th>Descripción</th>".
  19.    echo "<th>Precio</th>".
  20.    echo "</tr">.
  21.    echo "</thead>".
  22.    echo "<tbody>".
  23.        for($product in $products) {
  24.            for($product as $key => $value) {
  25.                echo "<tr>".
  26.                echo "<td>$value</td>".
  27.                echo "</tr>"
  28.            }
  29.        }
  30.    echo "</tbody>".
  31.    echo "</table>";
  32. }

Obviamente cuando cierres sesión o salgas de la página actual, la destruyes la sessión:

Código


Te aviso que lo he hecho muy rápido y al ojo en Notepad++, no lo he probado (no tengo ni Apache instalado xDD), así que es muy probable que haya errores.

Saludos.
« Última modificación: 24 Marzo 2015, 18:37 pm por #!drvy » En línea

"La vida es muy peligrosa. No por las personas que hacen el mal, si no por las que se sientan a ver lo que pasa." Albert Einstein
Páginas: [1] Ir Arriba Respuesta Imprimir 

Ir a:  

Mensajes similares
Asunto Iniciado por Respuestas Vistas Último mensaje
Escribir un formulario html en una pagina html
Desarrollo Web
adriancarcamo 1 3,328 Último mensaje 21 Febrero 2012, 18:38 pm
por Spider-Net
formulario html
Desarrollo Web
binario010101 5 2,686 Último mensaje 24 Febrero 2013, 10:41 am
por Ori-chan
Formulario HTML
Desarrollo Web
datab 1 1,827 Último mensaje 27 Marzo 2015, 10:40 am
por engel lex
Formulario html
Desarrollo Web
lor3nz0 1 1,790 Último mensaje 11 Febrero 2016, 22:20 pm
por Wick3D
Recaptcha en formulario html
PHP
eugeniocol 5 3,754 Último mensaje 11 Agosto 2017, 21:41 pm
por eugeniocol
WAP2 - Aviso Legal - Powered by SMF 1.1.21 | SMF © 2006-2008, Simple Machines