| Autor | Zpráva | ||
|---|---|---|---|
| SkyVessel Profil |
Opět zdravím,
jelikož mi javascript stále říká pane, tak i to, co vám předvedu mi dalo sakra zabrat :), tak snad to není kravina na první pohled :D. Cílem je vytvořit stránku podobnou rezervaci sedadel v kině :). V podstatě naklikat několik polček a data poslat dál ke zpracování. Než ale začnu něco dávat dokupy, tak se chci ujistit, jestli jdu na to dobře, popřípadě poraďte nějaké úpravy... <!doctype html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="generator" content="PSPad editor, www.pspad.com">
<meta name="keywords" content="">
<meta name="description" content="...">
<meta name="author" content="SkyVessel">
<link rel="shortcut icon" href="favicon.ico">
<title>kalendář</title>
<style type="text/css">
<!--
td {
border: 1px black solid;
text-align: center;
cursor: pointer;
}
.vyber input{
visibility: hidden;
}
//-->
</style>
</head>
<body>
<script>
function oznac(idt,idc)
{
if (document.getElementById(idc).checked == false)
{
document.getElementById(idc).checked = true;
document.getElementById(idt).style.backgroundColor = '#CFCFCF';
}
else
{
document.getElementById(idc).checked=false;
document.getElementById(idt).style.backgroundColor = '#FFFFFF';
}
}
</script>
<form method="post" name="vyber" id="vyber" class="vyber">
<table>
<tr><td colspan="3">pondělí:</td></tr>
<tr>
<td id="b1" onclick="oznac('b1','1')">8h - 11h <input type="checkbox" id="1" name="1" value="1"></td>
<td id="b2" onclick="oznac('b2','2')">11h - 14h <input type="checkbox" id="2" name="2" value="2"></td>
<td id="b3" onclick="oznac('b3','3')">14h - 17h <input type="checkbox" id="3" name="3" value="3"></td>
</tr>
<tr><td colspan="3">úterý:</td></tr>
<tr>
<td id="b4" onclick="oznac('b4','4')">8h - 11h <input type="checkbox" id="4" name="4" value="4"></td>
<td id="b5" onclick="oznac('b5','5')">11h - 14h <input type="checkbox" id="5" name="5" value="5"></td>
<td id="b6" onclick="oznac('b6','6')">14h - 17h <input type="checkbox" id="6" name="6" value="6"></td>
</tr>
<tr><td colspan="3">středa:</td></tr>
<tr>
<td id="b7" onclick="oznac('b7','7')">8h - 11h <input type="checkbox" id="7" name="7" value="7"></td>
<td id="b8" onclick="oznac('b8','8')">11h - 14h <input type="checkbox" id="8" name="8" value="8"></td>
<td id="b9" onclick="oznac('b9','9')">14h - 17h <input type="checkbox" id="9" name="9" value="9"></td>
</tr>
</table>
...
<button type="submit" id="Odeslat" name="Odeslat">Odeslat</button>
</form>
</body>
</html> |
||
| juriad Profil |
Ano, jdeš na to dobře.
Poznámky: 5., 6., 12., 22. řádek můžeš úplně vyhodit. Je třeba formuláři přidat autocomplete="false", jinak po refereshi obnoví původní hodnoty. Id teoreticky nesmí začínat číslicí, takže id="1" je neplatné. Ale funguje to. Je lepší nastavit třídu než nějaký konrétní styl, dovoluje to více prostoru. Lepší je display: none než visibility: hidden. Pokud nastavíš name u inputů tak jak jako já, PHP z toho rovnou udělá pole hodnot. Nejspíš chceš skrýt jen checkboxy, přendej tedy třídu vyber tabulce. Tlačítko pro odeslání je <input type="submit" ...>; zobrazený text je v jeho atributu value. Ten JS jde trochu zjednodušit: <!doctype html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="description" content="...">
<meta name="author" content="SkyVessel">
<link rel="shortcut icon" href="favicon.ico">
<title>kalendář</title>
<style type="text/css">
td {
border: 1px black solid;
text-align: center;
cursor: pointer;
background-color: #ffffff;
}
.vyber input {
display: none;
}
td.vybrany {
background-color: #cfcfcf;
}
</style>
</head>
<body>
<script>
function oznac(td) {
var input = td.getElementsByTagName('input')[0];
if (input.checked) {
td.className = '';
input.checked = false;
} else {
td.className = 'vybrany';
input.checked = true;
}
}
</script>
<form method="post" autocomplete="off">
<table class="vyber">
<tr>
<td colspan="3">pondělí:</td>
</tr>
<tr>
<td onclick="oznac(this)">8h - 11h
<input type="checkbox" name="vyber[]" value="1">
</td>
<td onclick="oznac(this)">11h - 14h
<input type="checkbox" name="vyber[]" value="2">
</td>
<td onclick="oznac(this)">14h - 17h
<input type="checkbox" name="vyber[]" value="3">
</td>
</tr>
<tr>
<td colspan="3">úterý:</td>
</tr>
<tr>
<td onclick="oznac(this)">8h - 11h
<input type="checkbox" name="vyber[]" value="4">
</td>
<td onclick="oznac(this)">11h - 14h
<input type="checkbox" name="vyber[]" value="5">
</td>
<td onclick="oznac(this)">14h - 17h
<input type="checkbox" name="vyber[]" value="6">
</td>
</tr>
<tr>
<td colspan="3">středa:</td>
</tr>
<tr>
<td onclick="oznac(this)">8h - 11h
<input type="checkbox" name="vyber[]" value="7">
</td>
<td onclick="oznac(this)">11h - 14h
<input type="checkbox" name="vyber[]" value="8">
</td>
<td onclick="oznac(this)">14h - 17h
<input type="checkbox" name="vyber[]" value="9">
</td>
</tr>
</table>
...
<input type="submit" value="Odeslat">
</form>
</body>
</html> |
||
| SkyVessel Profil |
#3 · Zasláno: 18. 3. 2014, 14:06:53
Tak jsem se k tomu konečně dostal...
juriad: > 5., 6., 12., 22. řádek můžeš úplně vyhodit. Díky... 5 a 6, jsem zapoměl smazat - nebudou tam vůbec. No ale když už jsme u toho - keywords už teda nemá cenu používat, jo? > Je třeba formuláři přidat autocomplete="false", jinak po refereshi obnoví původní hodnoty. To má fungovat jako, že po f5 zůstanou zaškrtnuté? To asi ne, protože mi to vždy najelo čisté :). > Id teoreticky nesmí začínat číslicí, takže id="1" je neplatné. Ale funguje to. To jsem si nebyl jistý, ale funkčnost mě zmátla. Díky > Je lepší nastavit třídu než nějaký konrétní styl, dovoluje to více prostoru. Pravda... > Lepší je display: none než visibility: hidden. Nevím, jak mě to napadlo, ale říkal jsem si, že to vypadá nějak divně. Díky =) > Pokud nastavíš name u inputů tak jak jako já, PHP z toho rovnou udělá pole hodnot. No vypadá to moc hezky, jednoduše a předpokládám, že to bude dělat i to, co jsem chtěl ale ještě nepřišel na způsob, jak to udělat :D. Jen jsem teď nepřišel na způsob, jak k tomu poli přistupovat. To je klasické pole? A ukládá to 0 a 1 nebo true a false? Něco jsem zkoušel, ale zatím jsem z toho nic nevytáhl, tak nevím :D > Nejspíš chceš skrýt jen checkboxy, přendej tedy třídu vyber tabulce. Přesně, díky... > Tlačítko pro odeslání je <input type="submit" ...>; zobrazený text je v jeho atributu value. Jo, jenže to mi po tom mojem visibility nějak nešlo najít, tak jsem to musel očůrat ... Hold někdy se člověk na to dívá a stejně neví, že to vidí :) > Ten JS jde trochu zjednodušit: Tím jsem si byl více než jist, ale js jsem nechápal už na škole :D Jinak díky moc... |
||
| juriad Profil |
Ano, keywords nemá vůbec cenu vyplňovat. Meta tagy » Další informace pro vyhledávače
SkyVessel: > > Je třeba formuláři přidat autocomplete="false", jinak po refereshi obnoví původní hodnoty. > To má fungovat jako, že po f5 zůstanou zaškrtnuté? To asi ne, protože mi to vždy najelo čisté :). Mě lokálně při refreshi zůstala pole zaškrtnutá a kvůli tomu se to chovalo divně (pole bylo na začátku vždy bílé bez ohledu na zaškrtunutí). autocomplete=false naopak zajišťuje, že všechna pole budou nevyplněná/nezaškrtnutá.
V proměnné $_POST['vyber'] bude pole obsahující jednotlivé value zaškrtnutých checkboxů. Nezaškrtnuté se neodesílají, nikdy.
Například var_dump($_POST):
array(1) {
["vyber"]=>
array(4) {
[0]=>
string(1) "1"
[1]=>
string(1) "2"
[2]=>
string(1) "5"
[3]=>
string(1) "7"
}
} |
||
|
Časová prodleva: 4 dny
|
|||
| SkyVessel Profil |
#5 · Zasláno: 22. 3. 2014, 22:59:37
juriad:
> Mě lokálně při refreshi zůstala pole zaškrtnutá a kvůli tomu se to chovalo divně (pole bylo na začátku vždy bílé bez ohledu na zaškrtunutí). autocomplete=false naopak zajišťuje, že všechna pole budou nevyplněná/nezaškrtnutá. No tak tohle mě nenapadlo, protože jsem to zkoušel už se skrytými checkboxy... > V proměnné $_POST['vyber'] bude pole obsahující jednotlivé value zaškrtnutých checkboxů. Nezaškrtnuté se neodesílají, nikdy. Jo, díky za praktickou ukázku. Pochopil jsem to a dokonce mi to i funguje :). Teď jen nevím, jakým způsobem navrhnout tabulku. Jde mi o to, že třeba teď v březnu bych chtěl mít plán i na duben, v dubnu už plánovat na květen atd... Samozřejmě je více uživatelů. Předpokládám, že udělat dvě pole a pomocí implode to nějak sesmolit dohromady je asi pořádná blbost. Udělat to v jedné tabulce a použít vce buněk, nebo dělat pro každý měsíc tabulku zvlášť? březen -> uživatel 1 -> den a, den b, den c, den d...
uživatel 2 -> den a, den b, den c, den d...
uživatel 3 -> den a, den b, den c, den d...
uživatel 4 -> den a, den b, den c, den d...
duben -> uživatel 1 -> den a, den b, den c, den d...
uživatel 2 -> den a, den b, den c, den d...
uživatel 3 -> den a, den b, den c, den d...
uživatel 4 -> den a, den b, den c, den d... |
||
|
Časová prodleva: 10 let
|
|||
0