NOVINKA! E-learningové kurzy umělé inteligence. Nyní AI za nejlepší ceny. Zjisti více:
NOVINKA – Víkendový online kurz Software tester, který tě posune dál. Zjisti, jak na to!
Avatar
Jan Štrobl
Člen
Avatar
Jan Štrobl:9.8.2017 13:00

Zdravím, mám dotaz ohledně checkboxů. Věděl by někdo jestli je možné ošetřit checkboxová pole tak, že alespoň jeden checkbox je povinný? Našel jsem řešení skrze javascript ale rád bych se kvůli rychlosti a náročnosti stránek držel co nejvíce HTML a CSS (i vyskakovací okna mám řešená skrz CSS).

U inputu typu radio jsem našel řešení že stačí označit pouze jeden radio input se stejným "name" a funguje to, ovšem u checkboxu to po mě chce vždy označit ten který jsem skrze html označil jako povinný.

Ukázka radio inputu

<input type="radio" name="cil[]" value="Praha" required>Praha<br />
<input type="radio" name="cil[]" value="Brno">Brno<br />
<input type="radio" name="cil[]" value="Plzeň">Plzeň<br />

Zde mám "required" pouze u Prahy, ovšem když zaškrtnu Brno, v pohodě mě to pustí. Dá se něco podobného udělat i zmíněných checkboxů?

Předem díky.

 
Odpovědět
9.8.2017 13:00
Avatar
Odpovídá na Jan Štrobl
Martin Štěpánek :9.8.2017 14:53

Já bych se opravdu držel javascriptu, ale pokud se mu opravdu chceš vyhnout, můžeš to ošetřit na straně serveru. Tedy napsat, že je alespoň jeden povinný, a pokud ho nezaklikne, tak na něj vyskočí error. :-)

Nahoru Odpovědět
9.8.2017 14:53
Všechno jde naprogramovat, chce to jen čas a chuť...
Avatar
Jan Štrobl
Člen
Avatar
Odpovídá na Martin Štěpánek
Jan Štrobl:9.8.2017 15:09

Jako, ono u takhle malého kódu (pár řádků) je to ve finále jedno. Spíš jsem čekal že když to jde v HTML ošetřit u radio inputu, tak to půjde i u checkboxu. No, pokud nikdo nebude vědět tak mi ve finále nic jiného nezbude :D

 
Nahoru Odpovědět
9.8.2017 15:09
Avatar
Martin Štěpánek :10.8.2017 10:02

Tak ono to přímo u radio inputů nejde ošetřit, ono to je jejich vlastností. Celkově radio inputy existují právě, proto aby jsi mohl zvolit jednu možnost. Takovéhle věci se podle mě nijak rozumě pomocí html nedají ošetřit :-)

Nahoru Odpovědět
10.8.2017 10:02
Všechno jde naprogramovat, chce to jen čas a chuť...
Avatar
Jan Štrobl
Člen
Avatar
Jan Štrobl:10.8.2017 10:56

To máš pravdu, ale předpokládal bych že když dáš required na ten kokrétní, tak to bude vyžadovat aby jsi zvolil tu danou možnost (stejně jako se chová u checkboxů) Ale pak by podle této logiky asi nastala zajímavá situace kdybys dal required všem radio inputům :) No nic, jdu tam hodit ten script :D

Editováno 10.8.2017 10:58
 
Nahoru Odpovědět
10.8.2017 10:56
Avatar
Odpovídá na Jan Štrobl
Wal De Mar-Lad:10.8.2017 12:27

Zdá sa mi, že to ide urobiť aj čisto s pomocou CSS tak, že použiješ sadu radio buttonov a preštýluješ ich pomocou CSS aby vyzerali ako checkboxy. Trik je tuším v tom, že použiješ štýl na radio:before a radio:after. Ale otestoval by som to potom v rôznych prehliadačoch, lebo je to viacmenej hack a nie som si istý kde to pôjde a kde nie.

Nahoru Odpovědět
10.8.2017 12:27
Libraries over frameworks...
Avatar
Odpovídá na Wal De Mar-Lad
Martin Štěpánek :10.8.2017 12:31

U radio buttonu nebude moci volit více možností, ale jen jednu

Nahoru Odpovědět
10.8.2017 12:31
Všechno jde naprogramovat, chce to jen čas a chuť...
Avatar
Odpovídá na Jan Štrobl
Martin Štěpánek :10.8.2017 12:32

No jasný, ale tím, že jednomu dáš required, tak se to uplatní na celou skupinu radio buttonů. Když mají stejné jména, tak patří k sobě. V případě checkboxů je každý input sám za sebe. :-)

Nahoru Odpovědět
10.8.2017 12:32
Všechno jde naprogramovat, chce to jen čas a chuť...
Avatar
Nahoru Odpovědět
10.8.2017 12:36
Všechno jde naprogramovat, chce to jen čas a chuť...
Avatar
Odpovídá na Martin Štěpánek
Wal De Mar-Lad:10.8.2017 12:37

To je tiež pravda. Popravde, ja takéto niečo riešim validátorom pri odoslaní formulára.

Nahoru Odpovědět
10.8.2017 12:37
Libraries over frameworks...
Avatar
Jan Štrobl
Člen
Avatar
Jan Štrobl:10.8.2017 13:16

Já ten script už mám, ale právě jsem hledal tu možnost skrze HTML. No, nevadí :-)

 <script type="text/javascript">
$(document).ready(function () {
    $('#button').click(function() {
      checked = $("input[type=checkbox]:checked").length;
      if(!checked) {
        alert("Některá pole nejsou vyplněna.");
        return false;
      }
    });
});
</script>
Akceptované řešení
+20 Zkušeností
+2,50 Kč
Řešení problému
 
Nahoru Odpovědět
10.8.2017 13:16
Avatar
Odpovídá na Jan Štrobl
Wal De Mar-Lad:10.8.2017 17:22

Mimochodom, často som videl obdobne napísaný kód a nie celkom tomu rozumiem... Nie tým lomítkam v BR, tie sú naprosto zbytočné, tým som si istý. Majú zmysel jedine ak by stránku parsoval nejaký XML parser a nie len prehliadač. Čo si nemyslím, že je Tvoj prípad. Ak sa však mýlim, tak potom Ti zas chýbajú lomítka aj v každom INPUT. Čomu však nerozumiem je to name="cil[]". Prečo je ten identifikátor zapísaný ako literál poľa? To má aký zmysel? Nevidím to prvý krát, potažmo nechápem to prvý krat...

<input type="radio" name="cil[]" value="Praha" required>Praha<br />
<input type="radio" name="cil[]" value="Brno">Brno<br />
<input type="radio" name="cil[]" value="Plzeň">Plzeň<br />
Nahoru Odpovědět
10.8.2017 17:22
Libraries over frameworks...
Avatar
Odpovídá na Wal De Mar-Lad
Michal Šmahel:10.8.2017 20:24

Souhlasím, u pole typu radio není možné vybrat více hodnot, není tedy třeba odesílat data v poli (vždy bude 1 hodnota). Toto má smysl u polí typu checkbox, kde je možné vybrat hodnot více.

Nahoru Odpovědět
10.8.2017 20:24
Nejdůležitější je motivace, ovšem musí být doprovázena činy.
Avatar
Honza Bittner
Tvůrce
Avatar
Odpovídá na Wal De Mar-Lad
Honza Bittner:10.8.2017 20:39

U radio buttonů je to trochu zvláštní, pravda, protože vždy vybereš jen jeden prvek. Avšak u checkboxů, kde můžeš vybrat více prvků a normálně po odeslání by se ti dostala na server jen poslední hodnota tak pomocí [] pošleš na server všechny vybrané hodnoty.

U radio inputů v tom ale smysl nevidím a pravděpodobně ani žádný není.

Nahoru Odpovědět
10.8.2017 20:39
FIT ČVUT alumnus :-) Sleduj mě na https://twitter.com/tenhobi a ptej se na cokoli na https://github.com/tenhobi/ama.
Avatar
Jan Štrobl
Člen
Avatar
Jan Štrobl:10.8.2017 21:19

Co se [] tyče, jsou tam z toho důvodu ze je to poměrně obsáhlý formulář a pod těmi radio inputy je ještě textovy input s name="cil". Ma to větší smysl u těch checkboxu ale nechal jsem to i zde :)

 
Nahoru Odpovědět
10.8.2017 21:19
Avatar
Odpovídá na Honza Bittner
Wal De Mar-Lad:11.8.2017 11:08

Na server sa mi dostanú všetky hodnoty. Len ako pozerám, PHP pri parsovani query stringu napríklad: ?cil=Praha&cil=Brno si najprv nadefinuje $_POST["cil"] = Praha a potom prepise na $_POST["cil"] = Brno. Potom to chápem - píše sa to tak kvôli tomu priblblému PHP. Alebo? Je ešte iný jazyk na serveri kvôli ktorému to tak treba písať?

Nahoru Odpovědět
11.8.2017 11:08
Libraries over frameworks...
Avatar
Honza Bittner
Tvůrce
Avatar
Odpovídá na Wal De Mar-Lad
Honza Bittner:11.8.2017 11:22

To je spíše nějaká obecná specifikace. Zkoušel jsem na serveru v Dartu a taky bere jen poslední hodnotu. Prostě se vytváří asociativní pole a to se snaží naplnit. Pokud máš více hodnot se stejným klíčem, prostě ti to přepíše.

Nahoru Odpovědět
11.8.2017 11:22
FIT ČVUT alumnus :-) Sleduj mě na https://twitter.com/tenhobi a ptej se na cokoli na https://github.com/tenhobi/ama.
Avatar
Odpovídá na Honza Bittner
Wal De Mar-Lad:11.8.2017 11:26

Ale to je práve ten problém. Neviem o tom nájsť ani zmienku v špecifikácii. Len odkedy je HTML living standard, možno sa špecifikácia zmenila a ja som pozeral zastaralé dokumenty. Nevieš o nejakej oficiálnej špecifikácii kde je to definované?

Nahoru Odpovědět
11.8.2017 11:26
Libraries over frameworks...
Avatar
Odpovídá na Wal De Mar-Lad
Neaktivní uživatel:11.8.2017 11:36

Tak ono se prostě jenom stačí řídit tím, že ty identifikátory mají být unikátní. Je možné, že to chování třeba není definované a shodou okolností to většinou funguje tak, že získáš jen poslední hodnotu. A nebo to je někde zahrabaný v nějaký specifikaci :)

Nahoru Odpovědět
11.8.2017 11:36
Neaktivní uživatelský účet
Avatar
Odpovídá na Wal De Mar-Lad
Neaktivní uživatel:11.8.2017 11:38

Ale podle některých tvrzení na to specifikace neexistuje a je to věc implementace
https://stackoverflow.com/…6566/3972886

Nahoru Odpovědět
11.8.2017 11:38
Neaktivní uživatelský účet
Avatar
Odpovídá na Neaktivní uživatel
Wal De Mar-Lad:11.8.2017 12:03

Dík za ten link, presne to som si aj myslel. Že v špecifikácii o tom nie je ani slovo. Tu máš query string a rob si s ním čo chceš...

Nahoru Odpovědět
11.8.2017 12:03
Libraries over frameworks...
Avatar
Odpovídá na Wal De Mar-Lad
Neaktivní uživatel:11.8.2017 12:16

Ve specifikaci HTTP zřejmě ne. Ale v dokumentaci technologií, které s ním pracují, by se to objevit mělo.

Nahoru Odpovědět
11.8.2017 12:16
Neaktivní uživatelský účet
Avatar
Odpovídá na Neaktivní uživatel
Wal De Mar-Lad:11.8.2017 12:43

To už bude záležať od konkrétneho jazyka. Postup w3c logiku má. Tu máš z klienta query string, čiže sadu key/value párov a pozor, keys nie sú unique. A keď si robíš svoj programovací jazyk na strane servera, sám a po svojom sa vysporiadaj s tým, že sa tam môže meno kľúča opakovať. Mne to príde v poriadku zo strany w3c. No a php sa s tým zjavne vysporiadalo tak, že odporúča, keďže to nie je prehrešok voči hml špecifikácii, že zapíšte hodnotu name atribútu ako array literal a my s tým budeme na serveri rátať a odovzdáme vám to ako pole. OK, tiež spôsob. Nepáči sa mi to síce, ale chápem to. Presnejšie, už to chápem.

Nahoru Odpovědět
11.8.2017 12:43
Libraries over frameworks...
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 23 zpráv z 23.