Avatar billede nordclc Nybegynder
28. maj 2013 - 21:44 Der er 7 kommentarer og
1 løsning

Finde ID på markerede celler i tabel

I nedenstående kode danner jeg en tabel med 3x3 celler med hver deres ID. Når man markerer en celle skifter den baggrundsfarve som indikation af at denne celle er markeret. Når formularen submittes vil jeg gerne have fat i ID på de celler som er markeret.

Mvh
Claus


<html>
<head>

<script type="text/javascript" >
function toggle(object) {
if ( object.style.backgroundColor == '' || object.style.backgroundColor == undefined ) {
object.style.backgroundColor = 'green';
} else {
object.style.backgroundColor = '';
}
}
</script>

</head>

<body>
Klik i nogle celler og tryk submit. Hvordan får jeg på action siden (test.asp") fat i ID på de celler der er markeret?
<form method="POST" name="test" action="test.asp">
<table border='1'>
<tr>
<td id="1" onclick = " toggle(this); " >&nbsp;</td>
<td id="2" onclick = " toggle(this); " >&nbsp;</td>
<td id="3" onclick = " toggle(this); " >&nbsp;</td>
</tr>
<tr>
<td id="4" onclick = " toggle(this); " >&nbsp;</td>
<td id="5" onclick = " toggle(this); " >&nbsp;</td>
<td id="6" onclick = " toggle(this); " >&nbsp;</td>
</tr>
<tr>
<td id="7" onclick = " toggle(this); " >&nbsp;</td>
<td id="8" onclick = " toggle(this); " >&nbsp;</td>
<td id="9" onclick = " toggle(this); " >&nbsp;</td>
</tr>
<tr>
<td colspan="3">
<input type="submit" value="Submit">
</td>
</tr>
</table>
</form>

</body>
</html>
Avatar billede scootergrisen Nybegynder
29. maj 2013 - 02:14 #1
Virker fint her.
Når man klikker bliver feltet grønt og når man klikker igen får farven væk.
Avatar billede nordclc Nybegynder
29. maj 2013 - 08:06 #2
scootergrisen> Ja det gør det også hos mig, men jeg kan ikke finde ud af at få fat i ID'et på de felter der er markeret?
Avatar billede jakobdo Ekspert
29. maj 2013 - 08:18 #3
Du har flere muligheder.
Du kunne jo evt. bruge nogle hidden input felter, som du sætter en værdi i, når toggle() er "on".

Alternativt skal du lave din egen "submit" funktion, som laver en submit med de ID'er fra dine td'er som igen er "on".

Giver det mening?
Avatar billede nordclc Nybegynder
29. maj 2013 - 08:27 #4
jakobdo> Ja det giver pludselig mening, jeg ved bare ikke lige hvordan jeg indsætter værdierne i de der hidden felter når toggle sættes til "on". Men jeg prøver lige at Google lidt (clientside til serverside form input), for det må der være masser af eksempler på. Tak for hjælpen indtil videre ;-)
Avatar billede jakobdo Ekspert
29. maj 2013 - 08:45 #5
Prøv denne kode:

<html>
<head>
<script type="text/javascript" >
function toggle(object) {
  if ( object.style.backgroundColor == '' || object.style.backgroundColor == undefined ){
    object.style.backgroundColor = 'green';
    object.childNodes[0].value = object.id;
  } else {
    object.style.backgroundColor = '';
    object.childNodes[0].value = '';
  }
}
</script>
</head>
<body>
Klik i nogle celler og tryk submit. Hvordan får jeg på action siden (test.asp") fat i ID på de celler der er markeret?
<form method="POST" name="test" action="">
<table border='1'>
<tr>
<td id="1" onclick = " toggle(this); " ><input type="hidden" id="check_1" name="1" > &nbsp;</td>
<td id="2" onclick = " toggle(this); " ><input type="hidden" id="check_2" name="2" >&nbsp;</td>
<td id="3" onclick = " toggle(this); " ><input type="hidden" id="check_3" name="3" >&nbsp;</td>
</tr>
<tr>
<td id="4" onclick = " toggle(this); " ><input type="hidden" id="check_4" name="4" >&nbsp;</td>
<td id="5" onclick = " toggle(this); " ><input type="hidden" id="check_5" name="5" >&nbsp;</td>
<td id="6" onclick = " toggle(this); " ><input type="hidden" id="check_6" name="6" >&nbsp;</td>
</tr>
<tr>
<td id="7" onclick = " toggle(this); " ><input type="hidden" id="check_7" name="7" >&nbsp;</td>
<td id="8" onclick = " toggle(this); " ><input type="hidden" id="check_8" name="8" >&nbsp;</td>
<td id="9" onclick = " toggle(this); " ><input type="hidden" id="check_9" name="9" >&nbsp;</td>
</tr>
<tr>
<td colspan="3">
<input type="submit" value="Submit">
</td>
</tr>
</table>
</form>
</body>
</html>
Avatar billede nordclc Nybegynder
29. maj 2013 - 10:46 #6
jakobdo> Tusind tak for hjælpen, der sparrede du mig for en masse søgen efter koden. Jeg har ændret lidt i dit skriv og nu virker det som jeg gerne vil have det, så læg et svar ;-)

Mvh Claus

Til andre som evt. vil bruge koden, så er den her:

Test.htm
========
<html>
<head>

<script language="javascript">
function toggle(object, IDvalue) {
  if ( object.style.backgroundColor == '' || object.style.backgroundColor == undefined ){
    object.style.backgroundColor = 'green';
    object.childNodes[0].value = IDvalue;
  } else {
    object.style.backgroundColor = '';
    object.childNodes[0].value = '';
  }
}
</script>

</head>
<body>
<form method="POST" name="test" action="test_post.asp">
<table border='1'>
<tr>
<td onclick = " toggle(this, 'felt1'); " ><input type="hidden" name="1">&nbsp;</td>
<td onclick = " toggle(this, 'felt2'); " ><input type="hidden" name="2">&nbsp;</td>
<td onclick = " toggle(this, 'felt3'); " ><input type="hidden" name="3">&nbsp;</td>
</tr>
<tr>
<td onclick = " toggle(this, 'felt4'); " ><input type="hidden" name="4">&nbsp;</td>
<td onclick = " toggle(this, 'felt5'); " ><input type="hidden" name="5">&nbsp;</td>
<td onclick = " toggle(this, 'felt6'); " ><input type="hidden" name="6">&nbsp;</td>
</tr>
<tr>
<td onclick = " toggle(this, 'felt7'); " ><input type="hidden" name="7">&nbsp;</td>
<td onclick = " toggle(this, 'felt8'); " ><input type="hidden" name="8">&nbsp;</td>
<td onclick = " toggle(this, 'felt9'); " ><input type="hidden" name="9">&nbsp;</td>
</tr>
<tr>
<td colspan="3">
<input type="submit" value="Submit">
</td>
</tr>
</table>
</form>
</body>
</html>



test_post.asp
=============
<%
for each item in request.form
  if request.form(item) <> "" Then
    response.write request.form(item) & "<br>"
  end if
next
%>
Avatar billede jakobdo Ekspert
29. maj 2013 - 10:58 #7
SvaR!
Avatar billede jakobdo Ekspert
29. maj 2013 - 11:06 #8
Takker for point.
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester