2016-07-05 50 views
0

我正試圖在此查詢中打開模態boostrap。我遇到的問題是當我點擊'更多信息'打開查詢的所有模式,並且我只想打開我點擊的所有模式。謝謝。如何在PHP查詢中打開twitter bootstrap模態

<?php 

$consult= "SELECT * FROM `films`"; 
$result = $conexion -> query($consult); 

if ($result) { 
    $cont3 = 0; //ID of the film 

    while ($nfila = $resultado -> fetch_object()) { 
     $film = "film".$cont3; //To make a unique ID to each film 

     echo "<form role='form' id='$film'> 
       <img src='images/".$nfila->image."'><br> 
       <h4>".$nfila->title." (".$nfila->year.") 
       <button type='button' class='btn btn-default' data-toggle='modal' data-target='.bs-example-modal-lg'>More Info</button></h4><br> 

       <div class='modal fade bs-example-modal-lg' tabindex='-1' role='dialog' aria-labelledby='myLargeModalLabel'> 
        <div class='modal-dialog modal-lg'> 
         <div class='modal-content'> 
          <div class='modal-header'> 
           <button tyle='button' class='close' data-dismiss='modal' aria-hidden='true'>&times;</button> 
           <h4 class='modal-tigle'>".$nfila->title."</h4> 
          </div> 
          <div class='modal-body'> 
           <img src='images/".$nfila->image."'><br> 
           <p><strong>Original Title: </strong>".$nfila->tituloOriginal."</p> 
           <p><strong>Year: </strong>".$nfila->anio."</p> 
           <p><strong>Country: </strong>".$nfila->pais."</p> 
           <p><strong>Sinopsis: </strong>".$nfila->sinopsis."</p> 
          </div> 
          <div class='modal-footer'> 
           <button type='button' class='btn btn-default' data-dismiss='modal'>Cerrar</button> 
          </div> 
         </div> 
        </div> 
       </div> 
     "; 
     echo "</form>"; 
     $cont3++; 
    } 
} else { 
    echo "There was a error to load the films"; 
} 

?> 
+0

使用連接到模態的div的'$ film' ID來針對特定的模式。 – Lee

回答

0

你要通過獨特的類,

下面是我的代碼,它會幫助你,

<?php 
     $consult= "SELECT * FROM `films`"; 
     $result = $conexion -> query($consult); 

    if($result){ 
     $cont3=0; //ID of the film 
     $i=0; 
     while($nfila = $resultado -> fetch_object()){ 
      $film="film".$cont3; //To make a unique ID to each film 
      $i++; 
      echo "<form role='form' id='$film'> 
        <img src='images/".$nfila->image."'><br> 
        <h4>".$nfila->title." (".$nfila->year.") 
        <button type='button' class='btn btn-default' data-toggle='modal' data-target='.modal". $i."'>More Info</button></h4><br> 

       <div class='modal fade bs-example-modal-lg modal". $i."' tabindex='-1' role='dialog' aria-labelledby='myLargeModalLabel'> 
       <div class='modal-dialog modal-lg'> 
       <div class='modal-content'> 
       <div class='modal-header'> 
       <button tyle='button' class='close' data-dismiss='modal' aria-hidden='true'>&times;</button> 
       <h4 class='modal-tigle'>".$nfila->title."</h4> 
       </div> 
       <div class='modal-body'> 
       <img src='images/".$nfila->image."'><br> 
       <p><strong>Original Title: </strong>".$nfila->tituloOriginal."</p> 
       <p><strong>Year: </strong>".$nfila->anio."</p> 
       <p><strong>Country: </strong>".$nfila->pais."</p> 
       <p><strong>Sinopsis: </strong>".$nfila->sinopsis."</p> 
       </div> 
       <div class='modal-footer'> 
       <button type='button' class='btn btn-default' data-dismiss='modal'>Cerrar</button> 
       </div> 
       </div> 
       </div> 
       </div>"; 

      echo "</form>"; 
      $cont3++; 
     } 
     } 
     else{ 
      echo "There was a error to load the films"; 
     } 
     ?> 
+0

哦,它的作品,非常感謝你的人! ;) – SilverSurfer

+0

@ silversurfer122歡迎您。如果它適合你,請接受這個答案。這樣也會對其他用戶有利。 –

0

這是因爲您正在開放目標模式與bs-example-modal-lg類。所有的模態都是一樣的。

你需要做的是給每個模態獨特的類。要做到這一點最後分配一個類與計數器,這將給它唯一性。

更新你這樣的代碼,

while ($nfila = $resultado->fetch_object()) { 
    $film = "film" . $cont3; //To make a unique ID to each film 
    echo "<form role='form' id='$film'> 
           <img src='images/" . $nfila->image . "'><br /> 
           <h4>" . $nfila->title . " (" . $nfila->year . ") 
           <button type='button' class='btn btn-default' data-toggle='modal' data-target='.customModalClass" . $cont3 . "'>More Info</button></h4><br /> 

          <div class='modal fade bs-example-modal-lg .customModalClass" . $cont3 . "' tabindex='-1' role='dialog' aria-labelledby='myLargeModalLabel'> 
          <div class='modal-dialog modal-lg'> 
          <div class='modal-content'> 
          <div class='modal-header'> 
          <button tyle='button' class='close' data-dismiss='modal' aria-hidden='true'>&times;</button> 
          <h4 class='modal-tigle'>" . $nfila->title . "</h4> 
          </div> 
          <div class='modal-body'> 
          <img src='images/" . $nfila->image . "'><br /> 
          <p><strong>Original Title: </strong>" . $nfila->tituloOriginal . "</p> 
          <p><strong>Year: </strong>" . $nfila->anio . "</p> 
          <p><strong>Country: </strong>" . $nfila->pais . "</p> 
          <p><strong>Sinopsis: </strong>" . $nfila->sinopsis . "</p> 
          </div> 
          <div class='modal-footer'> 
          <button type='button' class='btn btn-default' data-dismiss='modal'>Cerrar</button> 
          </div> 
          </div> 
          </div> 
          </div>"; 
    echo "</form>"; 
    $cont3++; 
} 

在上面的代碼中,我們在最後分配customModalClass類各模態與$cont3計數器以使其唯一。

0

你有一個錯誤的數據目標:

<button type='button' class='btn btn-default' data-toggle='modal' data-target='.bs-example-modal-lg'>More Info</button> 

你所有的情態動詞的有這個類,所以只是做類似的事情:

<div class='modal fade bs-example-modal-lg' id='modal_$film' tabindex='-1' role='dialog' aria-labelledby='myLargeModalLabel'> 

一旦你有一個ID,更改按鈕的數據目標:

data-target='#modal_$film' 

希望幫助

相關問題