닫는 버튼을 클릭하면 모달이 자동으로 다시 열립니다.

Question

테이블에 모달 뷰를 동적으로 만들려고했습니다.

테이블을 만드는 데 사용되는 데이터는 SQL 데이터베이스에서 가져옵니다.

이제 내 문제 :

내가 모달 뷰를 열고이해야 데이터가 포함된다 "세부 사항"라는 버튼을 클릭 할 때마다. 그러나 "닫기"- 단추 또는 오른쪽 위 모서리의 X로보기를 닫으려고하면 모달보기가 잠시 닫히고 자체적으로 다시 열립니다. 위에서 언급 한 작업 중 하나를 수행하면 배경이 어두워집니다.

여기 까다로운 부분이 있습니다. 키보드의 이스케이프 버튼을 사용하여 뷰를 닫을 때마다 뷰가 닫히고 이전 뷰로 돌아갑니다. 대한 명확한

<?php 
mysql_connect("localhost", "****" , "****"); 
mysql_select_db("hallo"); 

$sql= "SELECT * FROM erfassung WHERE Status='Abgeschlossen'"; 
$query=mysql_query($sql) or die (mysql_error()); 

while($row = mysql_fetch_assoc($query)) { 

    $thisId = $row['id']; 
    $thisModalId = 'modal'.$thisId; 
    $thisModalIdHref = '#'.$thisModalId; 
    $thisFormDoneId = $row['id'].'FormDoneId'; 
    // Create table row 
    echo "<tr onclick=\"input\" data-toggle=\"modal\" href='$thisModalIdHref'>"; 
    echo "<td>"; 
    echo $row['Name']; 
    echo "<td>"; 
    echo $row['Betreff']; 
    echo "<td>"; 
    echo "<button class=\"btn btn-primary btn-lg\" data-toggle=\"modal\" data-target='$thisModalIdHref'>"; 
    echo "Details"; 
    echo "</button>"; 


echo"<div class=\"modal fade\" id='$thisModalId' tabindex=\"-1\" role=\"dialog\" aria-labelledby=\"myModalLabel\" aria-hidden=\"true\">"; 
echo "<div class=\"modal-dialog\">"; 
    echo "<div class=\"modal-content\">"; 
    echo "<div class=\"modal-header\">"; 
    echo "<button type=\"button\" class=\"close\" data-dismiss=\"modal\" aria-hidden=\"true\">&times;</button>"; 
     echo "<h4 class=\"modal-title\" id=\"myModalLabel\">Weitere Information </h4>"; 
     echo "</div>"; 
     echo"<div class=\"modal-body\">"; 
     echo "<dl class=\"dl-horizontal\">"; 
     echo "<dt>Bereich</dt>"; 
     echo "<dd>" .$row['Bereich']. "</dd>"; 
     echo "</dl>"; 
     echo"</div>"; 
     echo"<div class=\"modal-footer\">"; 
     echo "<button type=\"button\" class=\"btn btn-default\" data-dismiss=\"modal\">Close</button>"; 
     echo "<button type=\"button\" class=\"btn btn-primary\">Save changes</button>"; 
     echo"</div>"; 
    echo"</div>"; //<!-- /.modal-content --> 
    echo"</div>";//<!-- /.modal-dialog --> 
echo"</div>";//<!-- /.modal --> 
    echo "</td>"; 
    echo "</tr>"; 
} 

?> 

:

$ thisModalId 이전 "MyModal"작동으로 변경되지만, 버튼을,이 같은 텍스트를 열 예정의 뜻으로합니다.

더 많은 소스 코드가 필요하면 게시 해 주시기 바랍니다.

도움 주셔서 미리 감사드립니다.

감사합니다.

Answer 1

이것은 아마도 div 모달이 onclick 처리기가 정의 된 요소 (tr) 내에 정의되어 있기 때문일 수 있습니다. 닫기 버튼 핸들러가 클릭 이벤트를 소비하지 않으면 포함 된 요소까지 모두 거품이 발생합니다 (div, div, div, div, td, tr). tr에 도달하면 onclick 처리기가 실행되고 모달이 다시 열립니다.

분명히, 모달 div을 실제로는 기능이없는 테이블 구조 안에 두지 않아도이를 해결할 수 있습니다. div가 테이블 바깥에 있어야하기 때문에 두 개 이상의 별도 루프를 수행해야합니다. 위의 주석 자의 조언을 받아 HTML에서 PHP를 조금 분리하면 코드가 엉망이 될 수도 있습니다. 이 같은

시도 뭔가 :

<?php 
    // Collect data 
    mysql_connect("localhost", "****" , "****"); 
    mysql_select_db("hallo"); 

    $sql= "SELECT * FROM erfassung WHERE Status='Abgeschlossen'"; 
    $query=mysql_query($sql) or die (mysql_error()); 

    $modals = array(); 
    while($row = mysql_fetch_assoc($query)) { 
    $modals[] = array(
     'id' => 'modal' . $row['id'], 
     'href' => '#modal' . $row['id'], 
     'FormDoneId' => $row['id'] . 'FormDoneId', 
     'Name' => $row['Name'], 
     'Betreff' => $row['Betreff'], 
     'Bereich' => $row['Bereich'], 
    ); 
    } 
?> 

<table> <!-- Or something --> 

<?php 
    foreach ($modals as $modal) { 
    // Create table rows 
?> 
    <tr onclick="input" data-toggle="modal" href="<?php echo $modal['href'] ?>"> 
    <td> 
    <?php echo $modal['Name'] ?> 
    <td> 
    <?php echo $modal['Betreff'] ?> 
    <td> 
    <button class="btn btn-primary btn-lg" data-toggle="modal" data-target="<?php echo $modal['href'] ?>"> 
     Details 
    </button> 
    </td> 
    </tr> 
<?php 
    } 
?> 

</table> 

<?php 
    foreach ($modals as $modal) { 
    // Create modal divs 
?> 
<div class="modal fade" id='<?php echo $modal['id'] ?>' tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 
<div class="modal-dialog"> 
    <div class="modal-content"> 
    <div class="modal-header"> 
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
     <h4 class="modal-title" id="myModalLabel">Weitere Information </h4> 
     </div> 
     <div class="modal-body"> 
     <dl class="dl-horizontal"> 
     <dt>Bereich</dt> 
     <dd><?php echo $modal['Bereich'] ?></dd> 
     </dl> 
     </div> 
     <div class="modal-footer"> 
     <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
     <button type="button" class="btn btn-primary">Save changes</button> 
     </div> 
    </div> //<!-- /.modal-content --> 
    </div>//<!-- /.modal-dialog --> 
</div>//<!-- /.modal --> 
<?php 
    }