1

te agradezco por entrar!
Sucede que todo lo que esté dentro del while desaparece, si tengo un boton dentro del while y otro fuera del while, solo se muestra el que esta fuera del while, este es el codigo que tengo:

El HTML es este:

<?php
  include("php/conexion.php");
  while($v = mysqli_fetch_array($resultado)){
?>
<li class="dropdown3"><a href="#modal<?php echo $v['id'] ?>" class="modal-trigger"><?php echo $v['titulo'] ?></a></li>
<?php
  }
?>

El PHP:

<?php
    $host_name = 'asd';
	$database = 'db7185617051';
	$user_name = 'dbo7185617051';
	$password = 'dsa';
	$connect = mysqli_connect($host_name, $user_name, $password, $database);

	if (mysqli_connect_errno()) {
		die('<p>Failed to connect to MySQL: '.mysqli_connect_error().'</p>');
	} else {
		$query = "SELECT * FROM informacion";
		$resultado = mysqli_query($conexion,$query);
	}
?>

Desde ya muchas gracias!

5
  • Aja y que quieres que hagamos con verlo en tu web?, deberias postear codigo que usas para llamar a esa libreria. Quiza en tu hosting no este encontrando la ruta de la libreria.
    – Alvarez
    el 11 ene. 2018 a las 22:18
  • ahi lo edite... el 11 ene. 2018 a las 22:33
  • Intenta poner $('#modal2') en lugar de $('#modal')
    – user22721
    el 11 ene. 2018 a las 22:46
  • Ahi intente pero es lo mismo, me funcionan todos los modales menos este que se conecta con la bd. el 11 ene. 2018 a las 22:56
  • estan cargando las librerias de bootstrap y jquery bien en la pagina remota el 12 ene. 2018 a las 17:53

2 respuestas 2

0

Intenta esto en tu js

$(document).ready(function(){
        $("#btnTriggerModal").on("click", function() { //Agrega un ID a tu botón
            $('.modal').modal();
            $('#modal2').modal('open');
        });
    });
});
8
  • Gracias por tu respuesta, igual sigue sucediendo lo mismo, como aclare en la publicación, deduzco que el problema viene del lado de php o mysql. el 11 ene. 2018 a las 23:49
  • Pero no pusiste el ID en tu botón que lanza el pop up "btnTriggerModal" el 12 ene. 2018 a las 13:51
  • Sube el código de conexion.php, cambia los accesos por unos temporales. el 12 ene. 2018 a las 14:26
  • Ahí subi el contenido del archivo. el 12 ene. 2018 a las 15:12
  • Te estas conectando a una base de datos remota verdad? te estaba pidiendo ese código para ver tu cadena de conexión, ya que efectivamente el error esta en el php y no carga el código del modal2 el 12 ene. 2018 a las 16:02
0

No puedes asignar el mismo id a varios elementos, los id deben ser únicos no se pueden repetir. Dentro del while siempre generas el el mismo ìd por lo que que cada modal que se genera repite el id:

<?php
  include("php/conexion.php");
  while($fila = mysqli_fetch_array($resultado)){
?>
<div id="modal2" class="modal">
  ...
</div>
<?php
}
?>

Podrías generar el link y el modal a la vez:

<?php
  include("php/conexion.php");
  while($fila = mysqli_fetch_array($resultado)){
?>

<a class="waves-effect waves-light btn modal-trigger" href="#modal<?= $fila['id'] ?>">Modal <?= $fila['id'] ?></a>

<div id="modal<?= echo $fila['id'] ?>" class="modal">
  <div class="modal-content info-modal">
      <img class="info-img" src="img.jpg">
      <h3 class="info-title"><?php echo $fila['titulo'] ?></h3>
      <ul class="collapsible" data-collapsible="accordion">
          <li>
              <div class="collapsible-header"><i class="material-icons">touch_app</i>¿Qué es esto?</div>
              <div class="collapsible-body"><span><?php echo $fila['que-es'] ?></span></div>
          </li>
          <li>
              <div class="collapsible-header"><i class="material-icons">help</i>¿Para que sirve?</div>
              <div class="collapsible-body"><span><?php echo $fila['para-que-sirve'] ?></span></div>
          </li>
          <li>
              <div class="collapsible-header"><i class="material-icons">build</i>¿Cómo se usa?</div>
              <div class="collapsible-body"><span><?php echo $fila['como-se-usa'] ?></span></div>
          </li>
          <li>
              <div class="collapsible-header"><i class="material-icons">dvr</i>Más comandos</div>
              <div class="collapsible-body"><span><?php echo $fila['mas-comandos'] ?></span></div>
          </li>
          <li>
              <div class="collapsible-header"><i class="material-icons">burst_mode</i>Más imágenes</div>
              <div class="collapsible-body"><span><?php echo $fila['imagenes'] ?></span></div>
          </li>
      </ul>
  </div>
  <div class="modal-footer">
      <a href="https://discord.gg/Gq8pjvc" target="_blank" class="modal-action modal-close deep-orange darken-2 white-text waves-effect waves-green btn-flat tooltipped" data-position="left" data-delay="50" data-tooltip="Soporte en el canal de Discord">Tengo un problema</a>
      <a href="#!" class="modal-action modal-close green darken-1 white-text waves-effect waves-green btn-flat">¡Gracias! :D</a>
  </div>
</div>

<?php
 }
?>

Quedando algo así:

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title></title>
  <!-- Compiled and minified CSS -->
  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/css/materialize.min.css">
  <!-- Compiled and minified JavaScript -->
  <script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/js/materialize.min.js"></script>
</head>
<body>

  <a class="waves-effect waves-light btn modal-trigger" href="#modal1">Modal 1</a>

  <div id="modal1" class="modal">
    <div class="modal-content info-modal">
        <img class="info-img" src="img.jpg">
        <h3 class="info-title">modal 1</h3>
        <ul class="collapsible" data-collapsible="accordion">
            <li>
                <div class="collapsible-header"><i class="material-icons">touch_app</i>¿Qué es esto?</div>
                <div class="collapsible-body"><span><?php echo $fila['que-es'] ?></span></div>
            </li>
            <li>
                <div class="collapsible-header"><i class="material-icons">help</i>¿Para que sirve?</div>
                <div class="collapsible-body"><span><?php echo $fila['para-que-sirve'] ?></span></div>
            </li>
            <li>
                <div class="collapsible-header"><i class="material-icons">build</i>¿Cómo se usa?</div>
                <div class="collapsible-body"><span><?php echo $fila['como-se-usa'] ?></span></div>
            </li>
            <li>
                <div class="collapsible-header"><i class="material-icons">dvr</i>Más comandos</div>
                <div class="collapsible-body"><span><?php echo $fila['mas-comandos'] ?></span></div>
            </li>
            <li>
                <div class="collapsible-header"><i class="material-icons">burst_mode</i>Más imágenes</div>
                <div class="collapsible-body"><span><?php echo $fila['imagenes'] ?></span></div>
            </li>
        </ul>
    </div>
    <div class="modal-footer">
        <a href="https://discord.gg/Gq8pjvc" target="_blank" class="modal-action modal-close deep-orange darken-2 white-text waves-effect waves-green btn-flat tooltipped" data-position="left" data-delay="50" data-tooltip="Soporte en el canal de Discord">Tengo un problema</a>
        <a href="#!" class="modal-action modal-close green darken-1 white-text waves-effect waves-green btn-flat">¡Gracias! :D</a>
    </div>
  </div>


  <a class="waves-effect waves-light btn modal-trigger" href="#modal2">Modal 2</a>

    <div id="modal2" class="modal">
  <div class="modal-content info-modal">
    <img class="info-img" src="<?php echo $fila['img'] ?>">
    <h3 class="info-title">modal 2</h3>
    <ul class="collapsible" data-collapsible="accordion">
      <li>
        <div class="collapsible-header"><i class="material-icons">modal2</div>
        <div class="collapsible-body"><span><?php echo $fila['que-es'] ?></span></div>
      </li>
      <li>
        <div class="collapsible-header"><i class="material-icons">help</i>¿Para que sirve?</div>
        <div class="collapsible-body"><span><?php echo $fila['para-que-sirve'] ?></span></div>
      </li>
      <li>
        <div class="collapsible-header"><i class="material-icons">build</i>¿Cómo se usa?</div>
        <div class="collapsible-body"><span><?php echo $fila['como-se-usa'] ?></span></div>
      </li>
      <li>
        <div class="collapsible-header"><i class="material-icons">dvr</i>Más comandos</div>
        <div class="collapsible-body"><span><?php echo $fila['mas-comandos'] ?></span></div>
      </li>
      <li>
        <div class="collapsible-header"><i class="material-icons">burst_mode</i>Más imágenes</div>
        <div class="collapsible-body"><span><?php echo $fila['imagenes'] ?></span></div>
      </li>
    </ul>
  </div>
  <div class="modal-footer">
    <a href="https://discord.gg/Gq8pjvc" target="_blank" class="modal-action modal-close deep-orange darken-2 white-text waves-effect waves-green btn-flat tooltipped" data-position="left" data-delay="50" data-tooltip="Soporte en el canal de Discord">Tengo un problema</a>
    <a href="#!" class="modal-action modal-close green darken-1 white-text waves-effect waves-green btn-flat">¡Gracias! :D</a>
  </div>
  </div>

  <script type="text/javascript">
    $(document).ready(function(){
      // the "href" attribute of the modal trigger must specify the modal ID that wants to be triggered
      $('.modal').modal();
    });
  </script>

</body>
</html>

10
  • Hola, muchas gracias por tu respuesta, en el momento que incluyo al botón que abre el modal dentro del while, ya deja de responder lo anterior, es decir el botón que abre el sideNav que contiene al botón que abre el modal. Todo lo que incluyo dentro del while desaparece. el 24 ene. 2018 a las 17:50
  • @GabrielBenitez ¿Lo estas incluyendo dentro del while pero fuera del modal? es raro, edita la pregunta y añade como tienes el código actualmente.
    – Xerif
    el 24 ene. 2018 a las 18:27
  • Ahi lo edite, nuevamente muchas gracias por ayudarme! el 24 ene. 2018 a las 18:55
  • @GabrielBenitez por lo que veo estas metiendo todo el menu dentro del while por lo que esto te dara problemas con los id, ademas de repetir el menu innecesariamente, aparte de que el <li> debe encerrar al <a href...> no al reves. Puedes poner los id a mano si los conoces, sin necesidad de incluir el link en el while.
    – Xerif
    el 24 ene. 2018 a las 19:30
  • Gracias por tu respuesta, hice lo que dijiste, me quedo el html un poco más ordenado, sin embargo el problema sigue siendo el mismo. el 24 ene. 2018 a las 20:45

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.