Pass a variable to a modal - PHP

1

I am making a query to my database, according to the results given. I get the books with a brief bibliographic description of the book, when I give it more try to get the same data and extract more data from my database. based on the ID of each book.

This is how books are displayed.

When I give it to see more I only get the first book with its title, but if I put it in another book the information keeps repeating

This is the code of how I show the brief information later already have made the connection and consultation.

<div class="card-block">
                               <!--Text-->
                               <p class="card-text">
                                
                                <?php echo$fila["autor"] ?><br> 
                                 <?php echo$fila["editorial"] ?><br>
                                 <?php echo$fila["idioma"] ?><br>
                                 <?php echo$fila["ano"] ?><br>
                                 <?php echo$fila["numeroPaginas"] ?><br>
                                 <?php echo$fila["edicion"] ?><br>
                                 <?php echo$fila["genero"] ?><br>
                                 <?php echo$fila["isbn"] ?><br>
                                 <?php echo$fila["ean"] ?><br>
                                 <?php echo$fila["formato"] ?><br>
                                 <?php $id = $fila["idlibros"]?>
                               </p>
                           </div>

And that's how I show the information in my modal

                           <!-- Button trigger modal -->
                        <button type="submit"  class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal" name="mimoda" id="milibro">
                             Ver mas 
                        </button>
                       
                        <!-- Modal -->
                        <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                          <div class="modal-dialog modal-lg" role="document">
                              <!--Content-->
                              <div class="modal-content">
                                  <!--Header-->
                                  <div class="modal-header">
                                      <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                          <span aria-hidden="true">&times;</span>
                                      </button>
                                      <h4 class="modal-title w-100" id="myModalLabel">
                                      
                                           <?php echo$fila["nombre"] ?>
                                           
                                      <br></h4>
                                  </div>
                                  <!--Body-->
                                  <div class="modal-body">
                                    
                                  </div>
                                  <!--Footer-->
                                  <div class="modal-footer">
                                      <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                                      <button type="button" class="btn btn-primary">Save changes</button>
                                  </div>
                              </div>
              
                          </div>
                        </div>

      
    
asked by Marcos Portillo Garcia 19.07.2017 в 10:12
source

4 answers

2

For this you have 2 options:

  • Create a modal for each book as it says @ j0se.
  • Have a single modal and modify it with Javascript , JQuery ... What you use.
  • I would opt for the second given that if you get to have a page with 40 titles, we would be talking about 40 manners per page. A lot.

    By clicking on each "See more", modify the modal data and then show it.

    EDIT

    In case you want to "extract more data" every time you click "See more", you should consider using Ajax .

    EDIT 2

    Check Jakala's comment, I've been testing it and it's interesting:)

        
    answered by 19.07.2017 / 12:19
    source
    0

    The id of See more should be unique for each book you could use a

                            <button type="submit"  class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal" name="mimoda" id="<?=$id?>_libro">
                             Ver mas 
                        </button>
    

    This inside a loop where you generate the books, so each book would have its own modal.

    Edit: The data-target should also be unique, both the button and the modal

        
    answered by 19.07.2017 в 10:22
    0

    this is a solution if you make the requests to the db embedded in the php, another solution would be an ajax request, which will answer the array with the information that you will show and modify the information from jquery, something that would be more practical.

                <div class="card-block">
                <!--Text-->
                    <p class="card-text">
                        <?php
    
                            /*
    
                            .descripción{
                                padding-top: 10px;
                            }
    
                            */
    
                            //Conexión a db, llenar el array $fila
    
                            foreach ($fila as $object){
                                echo '<p class="descripción">' . $object . '</p>'; 
                            }
    
                        ?>
                    </p>
                </div>
    
        
    answered by 19.07.2017 в 13:32
    0

    It is necessary to do a foreach to populate the video grid and a foreach to do as many manners as there are videos, I'll give you an example and I'll explain it below:

    /* Grilla de videos */    
    <?php foreach ($crud->ListarVideo() as $r): ?>
        <div class="col-sm-6 col-md-3 col-lg-3">
            <div class="portfolio-item thumbnail">
                <div class="hover-bg">
                    <a data-toggle="modal" data-target="#<?PHP echo $r->__GET('LinkNombre'); ?>" target="_new">
                        <div class="hover-text">
                            <h4><?PHP echo $r->__GET('Nombre'); ?></h4>
                            <small><?PHP echo $r->__GET('dato'); ?></small>
                            <div class="clearfix"></div>
                            <i class="fa fa-plus"></i>
                        </div>
                        <img src="img/comunidad/<?PHP echo $r->__GET('Imagen'); ?>" width="660" height="660" class="img-responsive" alt="<?PHP echo $r->__GET('Nombre'); ?>">
                    </a>
                </div>
            </div>
        </div>
        <?php endforeach; ?>
    
        <!-------------------- MODALES -------------------------->
    
        <?php foreach ($crud->ListarVideo() as $r): ?>
        <div id="<?PHP echo $r->__GET('LinkNombre'); ?>" class="modal fade" role="dialog">
            <div class="modal-dialog">
    
                <!-- Modal content-->
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal">&times;</button>
                        <h4 class="modal-title">Organización</h4>
                    </div>
                    <div class="modal-body">
                        <div class="container">
                            <div class="row">
                                <div class="col-xs-12 col-sm-6 col-md-6">
                                    <div class="well-sm">
                                        <div class="row">
                                            <div class="col-sm-6 col-md-4">
                                                <img src="img/videos/<?PHP echo $r->__GET('Imagen'); ?>" class="img-responsive" alt="<?PHP echo $r->__GET('Nombre'); ?>">
                                            </div>
                                            <div class="col-sm-8 col-md-8">
                                                <h4><?PHP echo $r->__GET('Nombre'); ?></h4>
                                                <h5><?PHP echo $r->__GET('Slogan'); ?></h5>
                                                <p>
                                                    <?PHP echo $r->__GET('Texto'); ?></p>
    
                                                <i class="glyphicon glyphicon-envelope"></i>
                                                <?PHP echo $r->__GET('Contacto'); ?>
                                                <br />
                                                <i class="glyphicon glyphicon-earphone"></i>
                                                <?PHP echo $r->__GET('Fono'); ?>
                                                <br />
    
                                                <?php $url=$r->__GET('Web'); $www = str_replace('http://', '', $url); ?>
    
                                                <i class="glyphicon glyphicon-globe"></i>
                                                <a href="<?PHP echo $r->__GET('Web'); ?>">
                                                    <?PHP echo $www; ?>
                                                </a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <?php endforeach; ?> 
    

    Notice that the modal name is dynamic id="<?PHP echo $r->__GET('LinkNombre'); ?>" and that in the video grid the modal link is the same <a data-toggle="modal" data-target="#<?PHP echo $r->__GET('LinkNombre'); ?>" target="_new"> (what you have as #myModal). This means that you can call each modal separately. In this case I am using object-oriented PHP but you can do it however you want and it works.

        
    answered by 19.07.2017 в 14:49