NOVINKA - Online rekvalifikační kurz Python programátor. Oblíbená a studenty ověřená rekvalifikace - nyní i online.
Hledáme nové posily do ITnetwork týmu. Podívej se na volné pozice a přidej se do nejagilnější firmy na trhu - Více informací.

Diskuze: Reset formuláře i pro zobrazení skrytých elementů

V předchozím kvízu, Online test znalostí JavaScript, jsme si ověřili nabyté zkušenosti z kurzu.

Jak se ti líbí článek?
Před uložením hodnocení, popiš prosím autorovi, co je špatněZnaků 0 z 50-500
Jak se ti kurz líbí?
Tvé hodnocení kurzuZnaků 0 z 50-500
Aktivity
Avatar
Daniel Horák
Člen
Avatar
Daniel Horák:24.11.2023 11:45

Mám formulář, ve kterém po zatrhnutí checkboxu s id "skladova" skryju několik polí a vypíšu text do jiného pole pomocí

$(function(){
                $("#skladova").click(function() {
                        if ($(this).is(':checked')) {
                                $(this).parents(".checkbox-card").find('.client-contact-box').hide();
                                $(this).parents(".checkbox-card").find('#zakaznik').val('prodejna');
                        }
                        else {
                                $(this).parents(".checkbox-card").find('.client-contact-box').show();
                                $(this).parents(".checkbox-card").find('#zakaznik').val('');
                        }
                });
        });

Pokud odškrtnu, text zmizí a pole se zobrazí. Pokud ale mám checkbox zaškrtlý a kliknu na standardní formulářový reset, tak se sice text vymaže a checkbox odškrtne, ale skrytá pole se nezobrazí.

Zkusil jsem: Zkoušel jsem k

<input type="reset" >

také doplnit nějaký id a vyvolat zobrazení toho elementu, což neumím. A laboroval jsem se styly ve výchozím nastavení, ale jquery je přepisuje.

Chci docílit: Potřebuji jednoduše skrýt element po zatržení checkboxu a zároveň zachovat funkčnost resetu. Aby se po jeho stisknutí formulář vrátil do výchozího nastavení tj. včetně zobrazeného elementu.

 
Odpovědět
24.11.2023 11:45
Avatar
Peter Mlich
Člen
Avatar
Peter Mlich:24.11.2023 12:55

"laboroval jsem se styly ve výchozím nastavení, ale jquery je přepisuje"

// pouzivas tuhle metodu
.hide();
.show();
// tak misto toho pouzij zmenu className: .
// addClass('newClass'); .removeClass('Old_class'); .toggleClass():

Bezny html input type=reset manipuluje s html prvky. Neresi javascript. Takze bych cely reset rucne delal asi pomoci javascriptu. A nebo, aby se po resetu spustil jeste js kod.
Take bys to mel promyslet i tak, aby formular fungoval i bez pouziti js. A nebo se rozhodnout, ze, jedne s js. A pak bych spis pouzival nejaky js framework pro formulare.

 
Nahoru Odpovědět
24.11.2023 12:55
Avatar
Daniel Horák
Člen
Avatar
Odpovídá na Peter Mlich
Daniel Horák:24.11.2023 17:43

Dobrá, takže při kliknutí na reset odstraním třídu, která to skrývá. To funguje

$("#reset").click(function(){
        $('#client-contact-box').removeClass('display-none');
})

Není možnost to vyvolat nějak samotnou tou událostí resetování formuláře, něco jako (form).reset() ?

 
Nahoru Odpovědět
24.11.2023 17:43
Avatar
DarkCoder
Člen
Avatar
Odpovídá na Daniel Horák
DarkCoder:24.11.2023 20:09

Řízení toku programu se provádí na základě hodnot FLAGŮ. Změna na checkboxu provádí přenastavení hodnoty jednoho FLAGU, reset provádí nastavení všech závislých FLAGŮ do výchozího stavu.

Nahoru Odpovědět
24.11.2023 20:09
"I ta nejlepší poučka postrádá na významu, není-li patřičně předána." - DarkCoder
Avatar
Peter Mlich
Člen
Avatar
Peter Mlich:27.11.2023 8:05

Myslim si, ze ne. Ale neznam posledni zmeny prohlizecu pro podporu js.

A jquery nepouzivam. Tezko rici, zda ten prikaz dela totez, co kod zapsany v html.

$("#reset").click(function(){
        $('#client-contact-box').removeClass('display-none');
})

<input type=reset onclick="return fff(this);">
<script>function fff() {neco(); return true;}</script>

Tam jde o to, ze return pro onclick vraci true nebo false. Jestli se ma spustit i normalni funkce toho tlacitka, coz je ve tvem pripade html-resetovani. Kdyz tam nic nedas, automaticke je tam true. Cili to tak muze byt, jak to mas. Nekdy prave potrebujes normalni chovani zakazat, treba u odkazu a-href se casto pouziva return false

 
Nahoru Odpovědět
27.11.2023 8:05
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 5 zpráv z 5.