[PHP][JavaScript]Pojedyńcze wybieranie slidetoggle Opcje

[rafik73]

Mam taki skrypt:

[JAVASCRIPT] pobierz, plaintext 
$(document).ready(function(){
 
    // when "More" or "Less" (class moreOptionsLink) was clicked.
    $(".toggle" ).click(function(){
 
        var txt = $(this).text();
 
        if(txt=='⇓'){
            /*
             * change the text to "Less"
             * change the background color to "red"
             * which means it shows all the options
             */
            $(this).text('⇑');
            $(this).css("background-color","red");
        }
 
        else{
            /*
             * change the text to "More"
             * change the background color to "green"
             * which means it hides other options
             */
            $(this).text('⇓');
            $(this).css("background-color","green");
        }
 
        /*
         * to animate the container of other options
         * we use jQuery "next" to select the "moreOptions" of the current row
         */
        $(".contact").slideToggle(200);
 
        // so that it won't refresh the page
        return false;
    });
});
[JAVASCRIPT] pobierz, plaintext 

oraz php (widok opisowy):

[PHP] pobierz, plaintext 
//tutaj początek pętli A (while)
 
//tutaj zapytanie mysql
 
//tutaj początek pętli B (while do zapytania mysql powyżej)
 
echo '<div><a href="" class="toggle">Contact</a></div>';  //przycisk-link rozsuwania diva o klasie contact
 
echo '<div class="contact">$zawartosc</div>'; //tutaj wyświetla się zawartość tabeli mysql
 
//tutaj koniec pętli B
 
//tutaj koniec pętli A
[PHP] pobierz, plaintext 

Problem w tym, że po naciśnięciu przycisku-linku rozsuwania diva rozsuwają się wszystkie wyświetlone w pętli divy z zawartością tabeli mysql.
Zmiana koloru przycisku inicjowana w skrypcie js działa zaś idywidualnie dla każdego wyświetlonego rekordu.

Ten post edytował rafik73 12.10.2015, 19:23:55