¿Cómo puedo resetear mi hetml después de realizar una consulta?

Iniciado por SpeedyFrost, 2 Enero 2019, 17:24 PM

0 Miembros y 1 Visitante están viendo este tema.

SpeedyFrost

Buenas tardes y feliz año,

Tengo una duda que no consigo resolver. Estoy haciendo una web de consulta y no consigo que el input - reset funcione. Por lo que he leído, debe encontrarse dentro de las etiquetas <form>, pero es que no tengo esas etiquetas en mi html. También pensé en usar document.getElementById("myForm").reset(); pero no me funciona tampoco.

La consulta la realizo a un servidor a través de un .js, la presento en pantalla dentro de una tabla y quiero poder restablecer la pagina para realizar otras consultas, sin darle F5.

El HTML es el siguiente:

<header>
   <div class="define">
   <img src="logoazul2-web.png" width="" height=""/>
   </div>
</header>
   <div id="wrapper">
      <div class="define" id="busqueda">
               <p>Buscar consulta:
               <input type="text" id="guid" name="guid" value=""/>
               <button class="btn" id="btn_enviar">Enviar</button>
               <br/>
               <div  align="center" id="Loader"style="display: none"><img id="Load" src="loading1.gif" width="60px" height="60px"/></div>
               </p>
      </div><br/>      
      <div class="table" id="salida"></div>   
      <br/>      
   </div>


El JS es este:

$(document).ready(function(){
             $('#btn_enviar').click(function(data){
                 $('#Loader').show();
                 $.ajax({
                     type: 'GET',
                     data: {'guid' : document.getElementById('guid').value},
                     url: 'Scrips/Server_connect.php',
                     dataType: '',

                     success: function (data){   

               var obj = JSON.parse(data);   
                        $('#Loader').hide();//Logo loading Inactivo
                    for(var c=0; c<obj.length; c++){
                       console.log(obj[c]);   
               }

               $.makeTable = function (obj){
                  var table = $('<table border=1>');
                  var tblHeader = "<tr>";
                  for (var k in obj[0])
                  tblHeader += "<th>" + k + "</th>";
                  tblHeader += "</tr>";
                  $(tblHeader).appendTo(table);                        
                  $.each(obj, function (index, value) {
                       var TableRow = "<tr>";
                  $.each(value, function (key, val) {
                  TableRow += "<td>" + val + "</td>";
                  });
                  TableRow += "</tr>";
                       $(table).append(TableRow);
                   });         
                   return ($(table));
                   table.inneriHTML='';
                      };
   
               var table = $.makeTable(obj);
               $(table).appendTo('#salida');
                     
                   }
         
         });
               
      });

});



Gracias de antemano!!


EdePC

Saludos,

- Si quieres restablecer todo, lo más eficaz es Recargar la Página, y si no quieres presionar F5 puedes hacerlo desde javascript con:

Código (javascript) [Seleccionar]
document.location.reload()

SpeedyFrost

Cita de: EdePC en  2 Enero 2019, 18:28 PM
Saludos,

- Si quieres restablecer todo, lo más eficaz es Recargar la Página, y si no quieres presionar F5 puedes hacerlo desde javascript con:

Código (javascript) [Seleccionar]
document.location.reload()


EdePC, te voy a tener que invitar a un café xD  Muchísimas gracias por tu ayuda!!!  ;-)




Al final he utilizado los siguiente:

$('#salida').empty(); --> Esto vacía la consulta cada vez que la realizas.

$('#guid').val(''); --> Deja vacío el cajetín input para realizar nuevas consultas.

*salida* es el id del div de la tabla que se genaera en el html, para exponer la consulta.
*guid* es el id del cajetín input.

Dejo aquí esto por si ayuda a alguien más.

[MOD] No hacer doble post, usar el botón "modificar" para añadir comentarios.