Diskuze – Lekce 20 - Editor tabulek v JavaScriptu

Zpět

Upozorňujeme, že diskuze pod našimi online kurzy jsou nemoderované a primárně slouží k získávání zpětné vazby pro budoucí vylepšení kurzů. Pro studenty našich rekvalifikačních kurzů nabízíme možnost přímého kontaktu s lektory a studijním referentem pro osobní konzultace a podporu v rámci jejich studia. Toto je exkluzivní služba, která zajišťuje kvalitní a cílenou pomoc v případě jakýchkoli dotazů nebo projektů.

Komentáře

Robert Domasta

Člen

Robert Domasta:16.10.2023 19:07

Začínám být přesvědčen, že tento kurz není pro úplné začátečníky. Bylo by fajn, to takhle prezentovat i před začátkem rekvalifikace.

Odpovědět

16.10.2023 19:07

Pavel Mikuška

Člen

Pavel Mikuška:30.10.2023 9:34

Prosím vás, kde je tá aktualizácia? Ubehol mesiac a pol. Ja si za to platím!

Autor článku je možno odborník v oblasti, ale nevie zrozumiteľne vysvetľovať. To sa nedá s kvalitou článkov vo vašom kurze Javy porovnať. Ako ste mohli takéto niečo uverjeniť?

Schválne, prečítajte si túto pasáž, či vám to dáva zmysel a či by ste vedeli po prvýkrát v živote podľa toho niečo spraviť a naučiť sa to:

Funkce pro vytvoření tabulky (pojmenujeme si ji vytvorVychoziTabulku()) vytvoří tabulku a vloží ji do body. Dvěma vnořenými cykly vytvoříme její buňky. Aby byly buňky editovatelné, vložíme do nich klasické textové pole – element <input>. Protože buňky budeme vytvářet na více místech, vytvoříme si pro jejich tvorbu funkci vytvorBunku(). Ta vytvoří element <td> a <input>. <input> vloží do <td> a buňku vrátí. Jelikož budeme programovat funkce, které v tabulce předpokládají označenou buňku, při označení buňky si tuto buňku musíme někam uložit. Existuje událost focus, která je vyvolána ve chvíli, kdy uživatel vybere nějaký prvek, ať již do něj klikne nebo se na něj třeba přesune tabulátorem. Při vytváření buňky událost tedy zároveň nově vytvořenému inputu obsloužíme a do proměnné aktivniBunka (kterou deklarujeme před deklarací funkce) buňku uložíme v případě, že je označená. Je třeba pamatovat na to, že při obsluhování události se mění obsah klíčového slova this na prvek, který událost vyvolal. Do proměnné aktivniBunka uložíme právě this (což bude element <input>, protože on vyvolal událost).

let aktivniBunka;

function vytvorBunku() {
    let td = document.createElement("td");

    let tdInput = document.createElement("input");

    tdInput.type = "text";
    tdInput.onfocus = function () {
        aktivniBunka = this;
    }
    td.appendChild(tdInput);

    return td;
}

Editováno 30.10.2023 9:35

Odpovědět

30.10.2023 9:34

Pavel Mikuška

Člen

Pavel Mikuška:30.10.2023 9:50

Absolútne nezrozumiteľné, krkolomné vetné konštrukcie, niektoré prvky vôbec nevysvetlené. Táto lekcia nemá žiadnu kvalitu. Prerobiť!

Odpovědět

30.10.2023 9:50

Martin Pracuch

Člen

Martin Pracuch:30.10.2023 11:58

trochu matoucí vysvětlení postupu, ale když už se člověk zorientuje, tak super

Odpovědět

30.10.2023 11:58

Lýdie Obermannová

Člen

Lýdie Obermannová:20.11.2023 11:58

Nechápu nic podle daného vysvětlení. Šlo by více názorněji? Třeba s nějakým obrázkem? Díky

Odpovědět

20.11.2023 11:58

Stanislava Marie Egyedová

Člen

Stanislava Marie Egyedová:29.11.2023 18:29

Příliš rychlé, nedá se pojmout tak, abych byla schopná samostatně použít.

Odpovědět

29.11.2023 18:29

Edita Karlovská

Člen

Edita Karlovská:30.11.2023 9:45

Z pohledu nováčka je to nepřehledné. V předchozí lekci je vypsáno x pojmů, které jsou pro nováčka těžko uchopitelné a v této lekci se slovy "Už bychom měli umět vše potřebné" máme zvládnout udělat takovouto tabulku? Nereálné. Co třeba vysvětlit každý jednotlivý řádek kódu? Mě by pomohlo, když si stáhnu hotový kód k lekci, aby v něm byl opravdu každý řádek okomentovaný jako pro "blbce". I když by se opakovalo...uděláme si cyklus...do něj teď vložíme... Protože zatím nemám cykly, funkce, podmínky apod. natolik zažité, abych je bez problémů sázela vše mi hned došlo. Berte to tak, že někdo ten kurz fakt dělá bez předchozích znalostí. Kuchaři také nestačí říct: jíška = máslo + mouka. Gratuluji, teď už umíš jíšku! 🙂

Odpovědět

30.11.2023 9:45

Jan Gritzbach

Člen

Jan Gritzbach:14.12.2023 11:58

Tato lekce není sama o sobě špatná. Vytvoření tabulky JavaScriptem je zajímavé téma a následné přidávání a mazání řádků a sloupců (v další lekci) přirozeně navazuje. Z tohoto pohledu by se mohlo jednat o kvalitní dílčí krok celého kurzu.

Bohužel se domnívám, že pro začátečníky se bude jednat o příliš složitý problém na to, že mají poprvé manipulovat DOM vlastním kódem. Mně to dává smysl, ale já už mám něco odprogramováno v jiných jazycích. JavaScript se nyní učím jen jako další technologii.

Kurz je však potřeba koncipovat tak, aby se i úplný začátečník neztratil.
Zkuste tuto lekci s tabulkou zachovat, ale zařadit před ni ještě nějakou další jednodušší lekci, kde se manipulace s DOM bude prezentova na jednodušších příkladech. Třeba nechte lidi napřed jen přidávat nebo mazat pár <li> prvků z nějakého <ol> seznamu nebo tak něco.

Teprve jakmile si nováčci na něčem jednodušším trochu zažijí základní příkazy pro manipulaci s DOM, nechť se teprve dostanou k této lekci s tabulkou. Pak to pro lidi nebude takový skok a všichni budou spokojení.

Odpovědět

14.12.2023 11:58

"Stay curious, learn every day!"

ing. SARNOVSKÝ Petr

Člen

ing. SARNOVSKÝ Petr:12.1.2024 7:51

V této části tutoriálu se ještě tabulka nedokáže vytvořit. Ani podle vzorového řešení.

Odpovědět

12.1.2024 7:51

ing. SARNOVSKÝ Petr

Člen

ing. SARNOVSKÝ Petr:12.1.2024 7:56

Omluva. Už jsem si našel chybu 😇

Odpovědět

12.1.2024 7:56

Naučíme tě pracovat na home-office.

Zjistit více...

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 10 zpráv z 102.

Nejčastěji vyhledáváné

Diskuze – Lekce 20 - Editor tabulek v JavaScriptu