Диалоговое окно Jquery не работает после того, как я установил лайтбокс

Question

Диалоговое окно Jquery не работает после того, как я установил лайтбокс

0

Вот мой код, теперь работает лайтбокс. Dialogbox работает только при удалении сценариев лайтбокса. Может ли кто-нибудь предположить, что может быть причиной того, что диалоговое окно не загружается?. на консоли хром отображается Uncaught TypeError: невозможно вызвать метод 'click' of null

<?php
    include 'header.inc.php';
    $floor_id=$_GET['id'];
    $path='floorPlanImages';
    //include 'addImageForPlan.php';
    $select_floor_images=mysql_query("SELECT id,image FROM zb_floorplan_gallery WHERE floor_id='$floor_id'");
    if(mysql_num_rows($select_floor_images)>0)
    {
    ?>

    <html lang="en">
    <!doctype html>
    <head>
      <meta charset="utf-8" />
      <title>jQuery UI Dialog - Default functionality</title>
      <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
      <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
      <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
      <link rel="stylesheet" href="css/style.css" />




    <link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />  
    </head>

    <table>

        <tr><th colspan="5">Image gallery</th></tr>
        <tr>

    <?php
    $count=0;
    while ($display_image=mysql_fetch_assoc($select_floor_images)) {

        ?>
        <td class="<?php echo $display_image['id'];?>" height="100" width="100">

        <!-- <img src="<?php echo $path.'/'.$display_image['image'];?>" width="100%" rel="lightbox[roadtrip]" class="<?php echo $display_image['id'];?>"></a> -->&nbsp;&nbsp;
         <a href="<?php echo $path.'/'.$display_image['image'];?>" rel="lightbox[gallery]" title="Floor Plan images">
            <img src="<?php echo $path.'/'.$display_image['image'];?>" width="100%" >
         </a>

           <a href="#" class="table-icon delete" title="Delete" id="<?php echo $display_image['id'];?>"></a></td>
        <?php
        $count++;
        if($count==4)
        {
        ?></tr><?php $count=0;
        }

    ?>


    <script type="text/javascript">
     $( document ).ready(function() {


            $('#<?php echo $display_image['id'];?>').click(function(){
            $( '#<?php echo $display_image['id'];?>').html("Are you sure you want to delete this image?").dialog(
                {

                     buttons: {
        'Confirm': function() {
           //do something
           $.ajax({
      type: "POST",
      url: "deleteFloorImage.php?id=<?php echo $display_image['id'];?>",
      data: { id: "<?php echo $display_image['id'];?>" }
    }).done(function( msg ) {

    $("td.<?php echo $display_image['id'];?>").hide();

    });
           $(this).dialog('close');
        },
        'Cancel': function() {
           $(this).dialog('close');
        }
      }
                }
            );
            });




      });
      </script>



    <?php
    }
    ?>
    </table>


    <?php
    }
    else {
        echo 'No images found for this floor plan';
    }
    include 'footer.inc.php';
    ?>
    <script type="text/javascript" src="js/prototype.js"></script>
    <script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script>
    <script type="text/javascript" src="js/lightbox.js"></script>

Krishnadas PC 21 сен. 2013, в 15:23

Источник

Теги:

php

javascript

jquery

lightbox

1 ответ

Ещё вопросы

Donovan Charpin · Answer 1 · 2013-09-21T10-15-00.000Z

Наблюдайте за DOM, чтобы найти ошибку.

Возможно, это конфликт jquery с lib.

Попробуйте написать jQuery.noConflict(); до:

$( document ).ready(function().....

И положите свою либу:

<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="js/lightbox.js"></script>

сразу после вызова вашей jquery lib

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

Спасибо за ответ. Я устал выше, но не повезло. Есть ли другой способ реализовать эти два на одной странице?