entre Desarrolladores

Recibe ayuda de expertos

Registrate y pregunta

Es gratis y fácil

Recibe respuestas

Respuestas, votos y comentarios

Vota y selecciona respuestas

Recibe puntos, vota y da la solución

Pregunta

2votos

Ajax borra contenido de mi pagina

Hola buenos días; mi problema es que creo contenido en mi pagina web desde AJAX pero al añadir este contenido me borra el que ya tenia, ademas que no me respeta las librerías que ya eh importado (bootstrap en este caso) no se si mi pregunta es muy obvia pero como puedo hacer la carga de mi contenido sin afectar el que tenia anexo mi código de ante mano gracias.

<html>                                                                                          <head>
<title></title>
<link href="css/bootstrap.min.css" rel="stylesheet">

 <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>                                                                                 </head>                                                                                         <body>  
 <table width="100%" border="0">
    <tr>
        <td align="center" width="100%">
            <label class="label label-primary">Realizacion de encuestas</label>
        </td>
    </tr>
</table>                                                                                            <script type="text/javascript">
    $(document).ready(function() {

    var cadena;
    var msj = "Cargando";
  //OBTENER JSON
  $.ajax({
    url : "http://192.168.0.13:8081/JSON/datos.php",
    dataType: 'jsonp',
    success:function(h){
     cadena = h;
     pintar(h);
     },
 error:function(){
     alert("Error");
 }  
});
  function pintar(cadena) 
  {
    for( var i = 0; i < cadena.registro.length; i++ ) {
      document.write("<form>");
     document.write("<div class=\"panel panel-default\"><div class=\"panel-heading\">"+
        cadena.registro[i].Pregunta + "</div> <div class=\"panel-body\">");
            for( var j = 0; j < cadena.registro[i].Respuestas.length; j++ )
      {
    document.write(" <div class=\"radio\">&nbsp;&nbsp;<input type=\"radio\" name=\"optradio\">  "+cadena.registro[i].Respuestas[j]+"</div>");
      }
      document.write("</div></div></div>");
      document.write("</form>")
      }

      }                                                                                                                        //PINTAR PREGUNTAS                                           });                                                                                                 </script>                                                                                    </body>                                                  </html>

1 Respuesta

2votos

white Puntos75880

en la funcion pintar la funcion document.write escribe en el documento, de ahi el posible problema, intenta guardar la informacion en una variable.

function pintar(cadena) 
{
  var html = "";

  for( var i = 0; i < cadena.registro.length; i++ ) {
    html += "<form>";
   html += "<div class=\"panel panel-default\"><div class=\"panel-heading\">"+
      cadena.registro[i].Pregunta + "</div> <div class=\"panel-body\">";
          for( var j = 0; j < cadena.registro[i].Respuestas.length; j++ )
    {
    html += " <div class=\"radio\">  <input type=\"radio\" name=\"optradio\">  "+cadena.registro[i].Respuestas[j]+"</div>";
    }
    html += "</div></div></div>";
    html += "</form>";
    }

    $('#contenedor').html(html);

}

despues de </table> agrega:

<div id="contenedor"></div>

de esta forma agregas html sin sobreescribir lo importante, esta linea: $('#contenedor').html(html); agrega el contenido de la variable html al div con id "contenedor". puedes usar $('#contenedor').append(otro_contenido) para añadir html al contenedor sin reemplazar el html existente.

0voto

AdanCervera comentado

Muchas gracias white; justo estaba haciendo eso cuando comentaste y anduvo a la perfección a seguir jugando con esto.

Por favor, accede o regístrate para responder a esta pregunta.

Otras Preguntas y Respuestas


...

Bienvenido a entre Desarrolladores, donde puedes realizar preguntas y recibir respuestas de otros miembros de la comunidad.

Conecta