[JavaScript]Tabelka Opcje

[chmiello96]

Z JS jestem całkowicie zielony, ale jest mi niezbędny do pewnego elementu strony.
Najłatwiej będzie mi to zaprezentować skrinami
(IMG:http://fotopasja.net/first.jpg)
Mamy tabelkę z komórkami. Każda z nich ma swoje id(po prawej stronie)

(IMG:http://fotopasja.net/sec.jpg)
Gdy klikniemy na komórkę zmienia kolor, oraz powoduje otwarcie się pod tabelą formularza z ukrytą zmienną, równą 'id'.

Nie mam pojęcia o javie i proszę o pomoc.
Jeśli jestem niezrozumiały, proszę pisać.
Będę wdzięczny za miłą pomoc (IMG:style_emoticons/default/smile.gif)

[tolomei]

Witaj.

Jeśli możesz to skopiuj kod HTML całej tabeli i wrzuć na JSFIDDLE.
Następnie zapisz i podaj linka tu na forum.

Pozdro.

[chmiello96]

http://jsfiddle.net/6G2jf/

[tolomei]

Co konkretnie ma się wydarzyć po kliknięciu na daną komórkę?
Ma się wyświetlić formularz?
Jak ma on wyglądać?
Czy ma być wysyłany standardowo, z przeładowaniem strony czy bez przeładowania?
Jaki ma mieć adres?

[chmiello96]

więc po kliknięciu na komórkę zmienia kolor
z formularzem dam sobie radę.
Chodzi o to, by móc wprowadzić w formularz ukrytą zmienną id wybranej komórki.

[tolomei]

JavaScript najsprawniej operuje na atrybutach znaczników.
W związku z tym proponuję Ci dodać atrybut id do każdego znacznika td, który reprezentuje konkretny dzień.
Tak jak prezentuje się to tutaj:
http://jsfiddle.net/6G2jf/1/

Teraz musimy napisać reakcję na kliknięcie na daną komórkę.
W celu uproszczenia kodu użyję biblioteki jQuery.
Pełna wersja tutaj:
http://jsfiddle.net/6G2jf/3/

Omówienie kodu:

[PHP] pobierz, plaintext 
$(function(){
 
    // wybieramy wszystkie elementy td, których id zaczyna się od "d_"
    // oraz przypisujemy do wszystkich obsługę zdarzenia 'click'
    $('table td[id^="d_"]').bind('click', function(){
 
        // blok służy do resetowania koloru wszystkich komórek
        $('table td[id^="d_"]').each(function(){
            $(this).css('background-color', '');
        });
 
        // klikniętej komórce nadajemy kolor
        $(this).css('background-color', 'lightgreen');
 
        // w tym bloku wyławiamy id komórki oraz wyświetlamy w
        // elemencie <div id="form">
        var elementId = $(this).attr('id');
        var dzienId = elementId.split('_');
        $('div#form').html('Formularz o id = '+dzienId[1]+'!!!');
    });
});
[PHP] pobierz, plaintext 

Pozdrawiam.

[chmiello96]

nieopisana radość z mojej strony i no po prostu bardzo Ci dziękuję (IMG:style_emoticons/default/smile.gif)