Avatar billede Monkeybrain Juniormester
27. april 2013 - 18:35 Der er 6 kommentarer og
1 løsning

vil ikke blokere checkbox når max er valgt.

Jeg har lavet dette.

http://www.hood.dk/seat.asp

MEN!
Det virker overhovedet ikke i Safari udover vælger funktionen.
Hvad er der med Mac og JavaScript?
Avatar billede olebole Juniormester
27. april 2013 - 18:44 #1
<ole>

Jeg kan ikke se, det virker i nogen browser. Hvis jeg klikker lidt 'glidende' i 001-feltet, så et eller flere af tegnene bliver valgt/highlighted, kan efterfølgende vælge så mange, jeg vil.

/mvh
</bole>
Avatar billede Monkeybrain Juniormester
27. april 2013 - 18:46 #2
Det var fordi jeg sad og rodede med det.

Prøv lige og se om det gør det stadig.
Avatar billede Monkeybrain Juniormester
27. april 2013 - 18:48 #3
Sorry jeg smed et svar, det var forkert valg. Pointene er dog stadig åben.
Avatar billede Monkeybrain Juniormester
27. april 2013 - 19:03 #4
Umiddelbart har jeg fundet ud af at at det ligger i 'label_check' funktionen..
Avatar billede olebole Juniormester
27. april 2013 - 19:47 #5
Prøv denne kode i stedet:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>
<style type="text/css">
table {
    border-collapse: collapse;
    margin: 0 auto;
}
td {
    height: 40px;
    width: 30px;
}
.label_check {
    position: relative;
    font-size: 15px;
    padding: 10px;
    margin: 10px 5px 10px 5px;
    overflow: hidden;
    color: #fff;
    background-color: #000000;
}
.label_check[selected=true] {
    background-color: #f00;
}
.label_check input {
    position: absolute;
    left: -10000px;
}
</style>
<script type="text/javascript">
function killEvent(e) {
    e.returnValue = false;
    if (e.preventDefault) e.preventDefault();
}
var numSelected = 0;
function selectSeat(e, elm) {
    var elmSrc = e.target||e.srcElement;
    if (elmSrc.className!=="label_check") return;
    if (!elmSrc.firstChild.checked) {
        if (numSelected===2) {
            alert("Du kan kun vælge to.");
            return killEvent(e);
        }
        numSelected++;
        elmSrc.setAttribute("selected", true);
    } else {
        numSelected--;
        elmSrc.removeAttribute("selected");
    }
}
</script>
</head>
<body>

<form id="ticketform" method="post" action="?">
<table onclick="selectSeat(event, this)">
<tbody>
<tr>
    <td>1</td>
    <td><label class="label_check"><input name="seat[]" value="001" type="checkbox">001</label></td>
    <td><label class="label_check"><input name="seat[]" value="002" type="checkbox">002</label></td>
    <td><label class="label_check"><input name="seat[]" value="003" type="checkbox">003</label></td>
    <td><label class="label_check"><input name="seat[]" value="004" type="checkbox">004</label></td>
    <td><label class="label_check"><input name="seat[]" value="005" type="checkbox">005</label></td>
    <td><label class="label_check"><input name="seat[]" value="006" type="checkbox">006</label></td>
    <td><label class="label_check"><input name="seat[]" value="007" type="checkbox">007</label></td>
    <td><label class="label_check"><input name="seat[]" value="008" type="checkbox">008</label></td>
    <td><label class="label_check"><input name="seat[]" value="009" type="checkbox">009</label></td>
    <td><label class="label_check"><input name="seat[]" value="010" type="checkbox">010</label></td>
    <td><label class="label_check"><input name="seat[]" value="011" type="checkbox">011</label></td>
    <td><label class="label_check"><input name="seat[]" value="012" type="checkbox">012</label></td>
</tr>
<tr>
    <td>2</td>
    <td><label class="label_check"><input name="seat[]" value="013" type="checkbox">013</label></td>
    <td><label class="label_check"><input name="seat[]" value="014" type="checkbox">014</label></td>
    <td><label class="label_check"><input name="seat[]" value="015" type="checkbox">015</label></td>
    <td><label class="label_check"><input name="seat[]" value="016" type="checkbox">016</label></td>
    <td><label class="label_check"><input name="seat[]" value="017" type="checkbox">017</label></td>
    <td><label class="label_check"><input name="seat[]" value="018" type="checkbox">018</label></td>
    <td><label class="label_check"><input name="seat[]" value="019" type="checkbox">019</label></td>
    <td><label class="label_check"><input name="seat[]" value="020" type="checkbox">020</label></td>
    <td><label class="label_check"><input name="seat[]" value="021" type="checkbox">021</label></td>
    <td><label class="label_check"><input name="seat[]" value="022" type="checkbox">022</label></td>
    <td><label class="label_check"><input name="seat[]" value="023" type="checkbox">023</label></td>
    <td><label class="label_check"><input name="seat[]" value="024" type="checkbox">024</label></td>
</tr>
<tr>
    <td colspan="13"></td>
</tr>
<tr>
    <td>3</td>
    <td><label class="label_check"><input name="seat[]" value="025" type="checkbox">025</label></td>
    <td><label class="label_check"><input name="seat[]" value="026" type="checkbox">026</label></td>
    <td><label class="label_check"><input name="seat[]" value="027" type="checkbox">027</label></td>
    <td><label class="label_check"><input name="seat[]" value="028" type="checkbox">028</label></td>
    <td><label class="label_check"><input name="seat[]" value="029" type="checkbox">029</label></td>
    <td><label class="label_check"><input name="seat[]" value="030" type="checkbox">030</label></td>
    <td><label class="label_check"><input name="seat[]" value="031" type="checkbox">031</label></td>
    <td><label class="label_check"><input name="seat[]" value="032" type="checkbox">032</label></td>
    <td><label class="label_check"><input name="seat[]" value="033" type="checkbox">033</label></td>
    <td><label class="label_check"><input name="seat[]" value="034" type="checkbox">034</label></td>
    <td><label class="label_check"><input name="seat[]" value="035" type="checkbox">035</label></td>
    <td><label class="label_check"><input name="seat[]" value="036" type="checkbox">036</label></td>
</tr>
</tbody>
</table>
</form>

</body>
</html>
Avatar billede Monkeybrain Juniormester
27. april 2013 - 19:50 #6
Ja. Jeg tænkte nok vi var ovre i noget css formatering istedet. Det virker.
Avatar billede olebole Juniormester
27. april 2013 - 20:00 #7
CSS-ændringerne er nu det mindste i denne forbindelse  =)

Jeg samler ikke point, så du lægger bare selv et svar og accepterer det, så tråden lukkes  =)
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



Seneste spørgsmål Seneste aktivitet
37 min siden Poe strøm Af lurup i LAN/WAN
I går 14:46 GIF-EDITOR Af snestrup2000 i Billedbehandling
I går 14:03 Logge ind Af Bob i PC
I går 12:12 2 skærme - 1 virker - den anden siger No signal Af eksmojo i Skærme
I går 10:33 openvpn projekt Af dcedata1977 i Windows