Mam następną pętlę w PHP:

foreach ($sid as $key => $value) {
    $sql = " a sql query ";
    $vehicle->rowQuery($sql);
    $numRows = $vehicle->rows;

        while ( $data = $vehicle->result->fetch_assoc()) {
            $vid            = $data['vid'];
            $vehicleName    = $data['vehicleName'];
            $noOfSeat       = $data['noOfSeat'];
            $seatBooked     = $data['seatBooked'];
            $supplierName   = $data['supplierName'];

            echo "<table class='table table-bordered table-condensed table-striped'>";
                echo "<tr>";
                    echo "<th colspan='4' class='success'>
                    <label class='checkbox-inline'>
                    <input type='checkbox' class='vehicleClass' name='vid[]' value='{$vid}'>$vehicleName<strong> ( $noOfSeat Seats available) - $supplierName
                    </label>
                    <div class='pull-right'><a href='#' class='hideMe'>Show/Hide</a></div></strong>&nbsp;
                    <input type='hidden' name='noOfSeat[$vid]' value='$noOfSeat'>
                    </th>";
                echo "</tr>";
                echo "<tr>";
                    echo "<th colspan='4'>All Seats</th>";
                echo "</tr>";

                $count = 0;
                for ($seat=1; $seat <= $noOfSeat; $seat++) {

                    if($count % 4 == 0) {
                        echo "</tr><tr class='toggleMe'>";
                    }
                    echo "<td><label class='checkbox-inline'><input type='checkbox' name='seatNo[$vid][]' value='$seat'>Seat $seat </label></td>";

                    $count++;
                }
            echo "</table>";
        }

    if( $numRows == 0 ) {
        echo "<table class='table table-bordered table-condensed table-striped'>";
        echo '<tr><td class="alert alert-warning">Your selected vehicle is not available.</td></tr>';
        echo "</table>";
    }
}

To wyjście jest takie:

enter image description here

Teraz próbuję pokazać i ukryć odpowiednią listę wyboru wszystkie fotele , klikam Pokaż / ukryj Link za pomocą następujących jQuery:

$(document).ready(function(){
    $('.hideMe').click(function() {
        $(this).next('.toggleMe').toggle();
    });
});

Ale pokaż / ukryj, że nie działa. Czy możesz mi powiedzieć, jak mogę to rozwiązać?

Dzięki.

===================.

Aktualizacja:

Gdy wynik pętli jest to:

enter image description here

Następnie użycie tego kodu działa dobrze:

$(document).ready(function(){
    $('.hideMe').click(function() {
        $('.toggleMe').toggle();
    });
});
0
Shibbir 4 czerwiec 2018, 08:06

3 odpowiedzi

Najlepsza odpowiedź

Czy używasz AJAX, aby uzyskać HTML? Jeśli tak, lepiej użyć $('body').on('click,'.hideMe',function() {}) i tr nie jest kolejnym elementem .hideMe
Możesz wypróbować ten kod.

$(document).ready(function(){
    $('body').on('click','.hideMe',function() {
        $(this).parents('table').find('.toggleMe').toggle();
    });
});
3
Yash Parekh 4 czerwiec 2018, 06:05

Myślę, że powinieneś użyć on('Click',function(){ }) zamiast click spróbuj tego

    $(document).ready(function(){
    $('body').on('click', '.hideMe', function() {
        $(this).next('.toggleMe').toggle();
    });
});
0
Kiran Shahi 4 czerwiec 2018, 05:20

Myślę, że twoja struktura z "<tr>" nie jest poprawna

if($count % 4 == 0) { echo "</tr><tr class='toggleMe'>"; }

Spowoduje to dodanie </tr> na początku każdej klasy Toggleme.

0
Rajesh V 4 czerwiec 2018, 05:25