Diskuze: Vložení do kategorie
V předchozím kvízu, Online test znalostí JavaScript, jsme si ověřili nabyté zkušenosti z kurzu.
Neaktivní uživatel:13.1.2015 21:33
Nevím jestli to půjde v php, ale zkus tohle:
http://jsfiddle.net/j0jgb93q/V JS se moc nevynám takže možná ti někdo poradí líp 
Michal Šmahel:13.1.2015 21:36
Máš to trochu divoké.
//Edit: A nech ho, ať si to zkusí sestavit sám, jinak se nic
nenaučí 
Neaktivní uživatel:13.1.2015 21:37
"V JS se moc nevynám takže možná ti někdo poradí líp "
Je to možné 
Podobné jsem
jednou potřeboval a našel v nějakém návodu.
Honza Bittner:13.1.2015 21:43
Za podmínek, že tvoje select část bude nad obsahem, který chceš zobrazovat, můžeš využít něco jako toto:
option[value="auto"]:selected ~ .div-s-obsahem-pro-autoCož by teoreticky mělo fungovat, prakticky nevím - nezkoušel jsem...
Já bych použil "onChange":
<select name="kategorie" onchange="jump_kategorie(form)">
...
</select>
Pak vytvoříš JS funkci:
function jump_kategorie(form)
{
kat=form.kategorie.value;
window.location.href = "volba-kategorie.php?kategorie="+kat;
}
A pak bych otestoval v souboru volba-kategorie.php, zda existuje proměnná
typu GET:
if(isset($_GET["kategorie"]))
{
zobrazení další nabídky závislé na volbě kategorie....
}
Ber to jen jako nástřel a né finální řešení. takhle jsem to někde
používal v kódu svého webu, kdy se po nějaké volbě zobrazovaly další,
závské na té první. snad to pomůže a není to příliš amatérské
Honza Bittner:13.1.2015 22:22
Nejoptimálnější řešení je pomocí CSS, což jsem psal výše. Je to však řešení né moc šetrné na úpravy, jelikož to děláš ručně. Preprocesorama se to dá docela usnadnit, ale stejně je tam velký podíl ruční práce.
Jinak bych doporučoval v JS udělat něco jako:
Zjistíš cyklem (each?) jaký option v daném section má 
elected, poté zavoláš
#value-z-option a takto dále... Budeš poté muset pouze míti value stejné
jako ID. Získáš tak univerzální řešení.
Honza Bittner:13.1.2015 23:11
- dělej kód univerzální
- proč dáváte na konec znovu .change() ?
Já bych to udělal tak, že dáš třídy/id stejné, jako jsou value v sectionu... Pak by kód byl nějak takto - s jQuery. Chce to ještě nějak ochytit ty elementy, které budeš zobrazovat - třeba je dáš do nějakého divu, či jim dáš třídu - ty máš koukám .box etc...
Také bych dal selectu nějakou třídu/id, aby nedocházelo ke kolizím při případném jiném selectu na stránce - ty máš koukám .kategorie.
$(".kategorie").change(function(){
$(".kategorie option:selected").each(function(){
var value = $(this).attr("value");
$(".box").hide();
$(".box." + value).show(); //např. .moznost.auta
});
});Takto nějak by to teoreticky mělo fungovat...
Honza Bittner:13.1.2015 23:28
Nejsem si jistý, že můžeš importovat jquery a zároveň v tom elementu mít JS kód?
Odděl to a zkus znova.
Michal Kuba:13.1.2015 23:28
Nevím jestli to nevidím jen já, ale když se podíváš na stránku : http://mainos.cekuj.net/…_inzerat.php
funguje to jak má?
Je nutné se zaregistrovat pro přidání inzerátu, stačí ale vytvořit
naprosto fake účet, já ho potom klidně smažu
Honza Bittner:13.1.2015 23:37
Pokud zkopíruji ten kód z tvé hlavičky do konzole tak to začne fungovat... Takže kód je dobře, ale JS to nenačte.
Podle W3schools se scripty v HTML zapisují takto: Uprav ten element, máš tam nějaké lang="javascript", což možná může dělat ten problém... ?
<script>
document.getElementById("demo").innerHTML = "Hello JavaScript!";
</script>Scripty by v hlavičce jít měly stejně dobře jako v body... tuším.
Michal Kuba:14.1.2015 0:01
Já se střelím, prostě furt to nedělá co má (ostatně, můžeš se
přesvědčit na webu sám) 
Proč to v tom internetovým testeru jde a mě na ostro ne? :/
Matyáš Procházka:14.1.2015 15:27
To $(".kategorie").change ... musíš načíst až potom, co se načte ten element v HTML...
(Řešení Honzy doplněné o mé poznámky)
takže buď takto:
<select class="kategorie"></select>
<script>
$(".kategorie").change(function(){
var value = $(".kategorie option:selected").attr("value");
$(".box").hide();
$(".box." + value).show();
});
</script>Nebo v hlavičce takto:
<script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script>
<script>
var test = function () {
$(".kategorie").change(function(){
var value = $(".kategorie option:selected").attr("value");
$(".box").hide();
$(".box." + value).show();
});
};
$(document).ready(test);
</script>+20 Zkušeností
+2,50 Kč
Michal Kuba:14.1.2015 16:23
Díky moc, už to funguje správně Tím jak nerozumím tolik JS tak nevím, co tam bylo špatně ale to
hlavní je, že to funguje. Doufám, že až to budu dělat pro dalších 6
kategorií a asi 30 podkategorií, že už to půjde..
Matyáš Procházka:14.1.2015 17:01
Jó, jednou jsem tento problém řešil s clickem asi půl dne a od tý doby
na něj nikdy nezapomenu
Matyáš Procházka:14.1.2015 17:02
To jsem rád.
Kdybys potřeboval třeba vysvětlit, co jednotlivá funkce dělá, tak napiš
Zobrazeno 39 zpráv z 39.