Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> Zaznaczanie wiersza za pomocą pola checkbox
martinstw
post 4.11.2008, 18:01:40
Post #1





Grupa: Zarejestrowani
Postów: 55
Pomógł: 0
Dołączył: 1.11.2008

Ostrzeżenie: (0%)
-----

Witam!

Zrobiłem sobie tabelkę jak widać poniżej:

<b><TABLE WIDTH=100% BORDER=1>
<TR BORDERCOLOR="black">
<TD HEIGHT=10px WIDTH=1px BGCOLOR="silver"><B>Stan.:</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=20px BGCOLOR="silver"><B>Nr operacji:</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=300px BGCOLOR="silver"><B>Tre¶ć operacji:</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=2px BGCOLOR="silver"><CENTER><B>KD</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=20px BGCOLOR="silver"><CENTER><B>Tj [min]</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=20px BGCOLOR="silver"><CENTER><B>Tpz [min]</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=20px BGCOLOR="silver"><CENTER><B>N</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=15px BGCOLOR="silver"><CENTER><B>Tko [min]</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=30px BGCOLOR="silver"><CENTER><B>Potw.</B></CENTER></TD>
</TR>
<TR BORDERCOLOR="black">
<TD HEIGHT=10px WIDHT=1px><CENTER><B>S1</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=20px><CENTER><B><a href="Op_mon_S1_05.html/">05</a></B></CENTER></TD>
<TD HEIGHT=10px WIDTH=300px><LABEL FOR<B>Wwwwwwwwwww wwwwwwwwwwwwww wwwwwwwwwwwww</B></TD>
<TD HEIGHT=10px WIDTH=2px><CENTER><B>B</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=20px><CENTER><B>0,015</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=20px><CENTER><B>0,020</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=20px><CENTER><B>10</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=25px><CENTER><B>124,00</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=30px><CENTER><B><P ALIGN="center"><INPUT TYPE="checkbox" NAME="S1/05" VALUE="S1/05" ID="wybor1">
</INPUT></P></B></TD>
</TR>
<TR BORDERCOLOR="black">
<TD HEIGHT=10px WIDHT=1px><CENTER><B>S1</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=20px><CENTER><B><a href="Op_mon_S1_10.html/">10</a></B></CENTER></TD>
<TD HEIGHT=10px WIDTH=300px><B>Zzzzzzzzzzzz zzzzzzzzzz z zzzzzzzzzzzz</B></TD>
<TD HEIGHT=10px WIDTH=2px><CENTER><B>D</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=20px><CENTER><B>0,2</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=20px><CENTER><B>12,9</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=20px><CENTER><B>6</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=25px><CENTER><B>78,00</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=30px><CENTER><B><P ALIGN="center"><INPUT TYPE="checkbox" NAME="S1/10" VALUE="S1/10">
</P></B></TD>
</TR>
</TABLE>
</b>

Nie wiem w jaki sposób przez zaznaczenie pola checkbox (albo klikniecie w wiersz, zaznaczać pole checkbox i cały wiersz) wybierać jednocześnie cały wiersz (rekord) i żeby wybrane rekordy były podświetlane?
W rekordzie jest jak widać jest 9 kolumn.

Będę wdzięczny za cenne wskazówki:)

Ten post edytował martinstw 4.11.2008, 23:12:53
Go to the top of the page
+Quote Post
 
 Start new topic
Odpowiedzi (1 - 5)
magnus
post 4.11.2008, 18:36:05
Post #2





Grupa: Zarejestrowani
Postów: 99
Pomógł: 15
Dołączył: 15.11.2007
Skąd: Nowogród Bobrz.

Ostrzeżenie: (0%)
-----

Do każdego wiersza tabeli przypisz ID:
Kod
<TR ID="tr_S1/05">
- najlepiej takie, które da się "wyliczyć" z nazwy checkboxa.

W checkboxie dodajesz
Kod
onclick="zaznacz(this);'


A funkcja np. tak:
Kod
<script type="text/javascript">
function zaznacz(ch) {
    tr_name = "tr_"+ch.name; //tu z nazwy checkboxa określasz ID wiersza
    if (ch.checked) {
        document.getElementById(tr_name).style.backgroundColor='yellow';
    } else {
        document.getElementById(tr_name).style.backgroundColor='';
    } //a tu mu zmieniasz kolor tła
}
</script>


--------------------
Efemental.pl - nasz punkt słyszenia :: recenzje :: tylko metal!
Opensource'owy klon Cantra: http://github.com/magnax/Simtr
Go to the top of the page
+Quote Post
martinstw
post 7.11.2008, 19:17:30
Post #3





Grupa: Zarejestrowani
Postów: 55
Pomógł: 0
Dołączył: 1.11.2008

Ostrzeżenie: (0%)
-----

Nie działa mi:( Nic się nie dzieje w wierszach:(

Może ja coś źle wpisuje?

Tak to u mnie wygląda:

<code>
<head>
<script type="text/javascript">
function zaznacz(ch) {
tr_name = "tr_"+ch.name; //z nazwy checkboxa określa się ID wiersza
if (ch.checked) {
document.getElementById(tr_name).style.backgroundColor='yellow';
} else {
document.getElementById(tr_name).style.backgroundColor='red';
} //zmiana koloru tła
}
</SCRIPT>
</HEAD>
</code>

<code>
<TABLE WIDTH=100% BORDER=1>
<TR BORDERCOLOR="black">
<TD HEIGHT=10px WIDTH=1px BGCOLOR="silver"><B>Stan.:</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=20px BGCOLOR="silver"><B>Nr operacji:</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=300px BGCOLOR="silver"><B>Treść operacji:</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=2px BGCOLOR="silver"><CENTER><B>KD</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=20px BGCOLOR="silver"><CENTER><B>Tj [min]</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=20px BGCOLOR="silver"><CENTER><B>Tpz [min]</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=20px BGCOLOR="silver"><CENTER><B>N</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=15px BGCOLOR="silver"><CENTER><B>Tko [min]</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=30px BGCOLOR="silver"><CENTER><B>Potw.</B></CENTER></TD>
</TR>
<TR ID="tr_S1_05" BORDERCOLOR="black">
<TD HEIGHT=10px WIDHT=1px><CENTER><B>S1</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=20px><CENTER><B><a href="Op_mon_S1_05.html/">05</a></B></CENTER></TD>
<TD HEIGHT=10px WIDTH=300px><LABEL FOR<B>Wwwwwwwwwww wwwwwwwwwwwwww wwwwwwwwwwwww</B></TD>
<TD HEIGHT=10px WIDTH=2px><CENTER><B>B</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=20px><CENTER><B>0,015</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=20px><CENTER><B>0,020</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=20px><CENTER><B>10</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=25px><CENTER><B>124,00</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=30px><CENTER><B><P ALIGN="center"><INPUT TYPE="checkbox" NAME="wybor" VALUE="S1_05" onClick="zaznacz(this);">
</INPUT></P></B></TD>
</TR>
<TR ID="tr_S1_10" BORDERCOLOR="black">
<TD HEIGHT=10px WIDHT=1px><CENTER><B>S1</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=20px><CENTER><B><a href="Op_mon_S1_10.html/">10</a></B></CENTER></TD>
<TD HEIGHT=10px WIDTH=300px><B>Zzzzzzzzzzzz zzzzzzzzzz z zzzzzzzzzzzz</B></TD>
<TD HEIGHT=10px WIDTH=2px><CENTER><B>D</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=20px><CENTER><B>0,2</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=20px><CENTER><B>12,9</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=20px><CENTER><B>6</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=25px><CENTER><B>78,00</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=30px><CENTER><B><P ALIGN="center"><INPUT TYPE="checkbox" NAME="wybor" VALUE="S1_10" onclick="zaznacz(this)">
</P></B></TD>
</TR>
<TR ID="tr_S1.1_120EL" BORDERCOLOR="black">
<TD HEIGHT=10px WIDHT=1px><CENTER><B>S1.1</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=20px><CENTER><B><a href="Op_mon_S1.1_120EL.html/">120EL</a></B></CENTER></TD>
<TD HEIGHT=10px WIDTH=300px><B>Yyyyyyyyyy yyyyy yyyyyyyyyyyyyyyy</B></TD>
<TD HEIGHT=10px WIDTH=2px><CENTER><B>KT</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=20px><CENTER><B>0,8</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=20px><CENTER><B>10,4</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=20px><CENTER><B>13</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=25px><CENTER><B>52,00</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=30px><CENTER><B><P ALIGN="center"><INPUT TYPE="checkbox" NAME="S1.1/120EL" VALUE="S1.1/120EL" onclick="mark(this)">
</P></B></TD>
</TR></TABLE>
</code>

Także jeśli coś źle robię to proszę o uwagi

Znalazłem już rozwiązanie tego problemu:) Działa bez problemu!

<quote>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<!--Powoduje zaznaczanie i podświetlanie wybranego całego wiersza i checkboxa przez kliknięcie w pole checkbox-->

<style type="text/css">
td{border:1px solid black;}
tr{background:snow;}
</style>

<script type="text/javascript">
function rowYourBoat(){
var trs=document.getElementById('tabela3').rows;
for(var i=0;i<trs.length;i++){
if(document.formularz1.elements[i].checked){
trs[i].style.background="aqua";
}else{
trs[i].style.background="snow";
}
}
}
</script>
</HEAD>

</quote>

natomiast w BODy mamy:

<quote>

<BODY>
<!-- Tabela 3 -->

<form action="" name="formularz1">
<TABLE WIDTH=100% id="tabela3" onclick="rowYourBoat();">
<TR>
<TD HEIGHT=10px WIDTH=29px><CENTER><B>15</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=39px><CENTER><B>S1</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=22px><CENTER><B>0</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=66px><CENTER><B><a href="Op_mon_S1_05.html/">050ELAU!</a></B></CENTER></TD>
<TD HEIGHT=10px WIDTH=515px><LABEL FOR<B>Wwwwwwwwwww wwwwwwwwwwwwww wwwwwwwwwwwww</B></TD>
<TD HEIGHT=10px WIDTH=23px><CENTER><B>B</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=60px><CENTER><B>0,015</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=60px><CENTER><B>0,020</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=18px><CENTER><B>10</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=66px><CENTER><B>120,00</B></CENTER></TD>
<TD HEIGHT=70px WIDTH=><CENTER><B><P ALIGN="center"><INPUT TYPE="checkbox" NAME="wybor" VALUE="S1/05" />
</INPUT></P></B></TD>
</TR>
<TR>
<TD HEIGHT=10px WIDTH=29px><CENTER><B>15</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=39px><CENTER><B>S1</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=22px><CENTER><B>0</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=66px><CENTER><B><a href="Op_mon_S1_05.html/">050ELAU!</a></B></CENTER></TD>
<TD HEIGHT=10px WIDTH=515px><LABEL FOR<B>Wwwwwwwwwww wwwwwwwwwwwwww wwwwwwwwwwwww</B></TD>
<TD HEIGHT=10px WIDTH=23px><CENTER><B>B</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=60px><CENTER><B>0,015</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=60px><CENTER><B>0,020</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=18px><CENTER><B>10</B></CENTER></TD>
<TD HEIGHT=10px WIDTH=66px><CENTER><B>120,00</B></CENTER></TD>
<TD HEIGHT=70px WIDTH=><CENTER><B><P ALIGN="center"><INPUT TYPE="checkbox" NAME="wybor" VALUE="S1/05" />
</INPUT></P></B></TD>
</TR>
</TABLE>
</BODY>
</HTML>
</quote>

Także zamykam ten post i mam nadzieje, że komuś się również przyda to rozwiązanie

Pozdrawiam wszystkich:)
Go to the top of the page
+Quote Post
bregovic
post 7.11.2008, 19:30:54
Post #4





Grupa: Zarejestrowani
Postów: 562
Pomógł: 15
Dołączył: 8.08.2003
Skąd: Denmark/Odense

Ostrzeżenie: (0%)
-----

Używaj BBCode! Tylko święty (lub ktoś z bardzo dużą ilością czasu) przebrnie przez ten kod bez kolorowania...

Ten post edytował bregovic 7.11.2008, 19:31:21


--------------------
Prank - for the fun. Mac - for the simplicity. Deviantart - for the kick.
Life is ours, We live it our way -- Metallica
Go to the top of the page
+Quote Post
batman
post 7.11.2008, 19:41:24
Post #5





Grupa: Moderatorzy
Postów: 2 921
Pomógł: 269
Dołączył: 11.08.2005
Skąd: 127.0.0.1
@bregovic Zamiast nabijać posty, użyj przycisku Raportuj.


--------------------
I would love to change the world, but they won't give me the source code.
My software never has bugs. It just develops random features.
Go to the top of the page
+Quote Post
bregovic
post 7.11.2008, 20:13:46
Post #6





Grupa: Zarejestrowani
Postów: 562
Pomógł: 15
Dołączył: 8.08.2003
Skąd: Denmark/Odense

Ostrzeżenie: (0%)
-----

@batman, hm, ok, chciałem mu po prostu zwrócić uwagę. Z tego co pamiętam z dawnych dni tego tego forum, raportowania używaliśmy w bardziej poważnych przypadkach. Ale ok, dostosuję się smile.gif


--------------------
Prank - for the fun. Mac - for the simplicity. Deviantart - for the kick.
Life is ours, We live it our way -- Metallica
Go to the top of the page
+Quote Post
« Następny starszy · Szukam · Następny nowszy »
 

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 

Tryb wyświetlania: Przełącz na: Standardowy · Linearny+ · Przełącz na: Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Wersja Lo-Fi Aktualny czas: 19.07.2025 - 12:45
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn