Jak na jednoduchy HTML konfigurator produktu?

Gorgonzola73

7. 4. 2015 15:35:50

Potrebuji vytvorit jednoduchy konfigurator produktu (idealne html formular) s temito vlastnostmi:

1. Input s relevantnimi volbami k polozce predchozi

3. po zvoleni polozky v druhem navysit CENU a refreshnout jeji zobrazeni

4. takto pokracovat az do zaverecneho

5. na konci SUBMIT odesle naklikane hodnoty do DB nebo proste nekam na vystup

Prosim o doporuceni technologie (PHP+MySQL nebo JS nebo JQuery nebo ...?), pripadne jestli nekde nevisi nejaky sikovny on-line generator (hledal jsem...)

Diky!

7. 4. 2015 15:35:50

https://webtrh.cz/diskuse/jak-na-jednoduchy-html-konfigurator-produktu/#reply1104551

Malcánek Jan

(4 hodnocení)

7. 4. 2015 18:58:58

Toto by mělo jít udělat v celku jednoduše ajaxem a já osobně bych použil jQuery, ale jde to i bez něj. Udělal bych onchange na příslušný input, zde by se vygeneroval druhý input a cena dle výběru, pokud je potřeba cenu brát z db, tak ji vytáhneš přes ajax. A submit na konci ti pak odešle celý formulář i generované položky (pokud je budeš generovat dovnitř formuláře).

7. 4. 2015 18:58:58

https://webtrh.cz/diskuse/jak-na-jednoduchy-html-konfigurator-produktu/#reply1104550

Karol Smolík

(5 hodnocení)

7. 4. 2015 18:59:17

Budeš potrebovať JS, pre uľahčenie môžeš použiť aj jQuery, dáta do MySQL môžeš ukladať AJAX-om cez PHP

7. 4. 2015 18:59:17

https://webtrh.cz/diskuse/jak-na-jednoduchy-html-konfigurator-produktu/#reply1104549

Gorgonzola73

8. 4. 2015 12:45:16

Napsal malacanek;1184282
Toto by mělo jít udělat v celku jednoduše ajaxem a já osobně bych použil jQuery, ale jde to i bez něj. Udělal bych onchange na příslušný input, zde by se vygeneroval druhý input a cena dle výběru, pokud je potřeba cenu brát z db, tak ji vytáhneš přes ajax. A submit na konci ti pak odešle celý formulář i generované položky (pokud je budeš generovat dovnitř formuláře).

Diky za tip a nasmerovani.

Trochu jsem googlil a skutecne idealni by bylo postupne tahat relevantni polozky z db pres PHP+Ajax. Jak to udelat "jednokrokove", toho je plny web, ale ja bych potreboval poradit, jak to tu udelat pro x dropdown selectu po sobe.

Cili: Vyber v prvnim dropdown selectu -> na zaklade zvolene polozky dotaz pes PHP+Ajax do MySQL a vygenerovani dalsiho dropdown selectu s relevantnimi polozkami -> ...a takto opakovat treba 10x po sobe, az postupne nasbiram veskere pozadovane vlastnosti produktu

Moc by mi pomohl nejaky kus kodu.

Predem dik moc :)

---------- Příspěvek doplněn 08.04.2015 v 14:17 ----------

Jeste prikladam jednoduchy nacrtek, jak bychom ptrebovali, aby to fungovalo.

odkaz na obrazek: http://1drv.ms/1FfZR2i

8. 4. 2015 12:45:16

https://webtrh.cz/diskuse/jak-na-jednoduchy-html-konfigurator-produktu/#reply1104548

Malcánek Jan

(4 hodnocení)

8. 4. 2015 14:48:35

Náčrtek se mi nezobrazuje, ale zkusím to teda nějak popsat v kódu.

jQuery:

PHP:

Asi nějak takto. Je to narychlo sesmolené, tak je možné, že tam budou chyby, ale jako inspirace by to mělo stačit.

8. 4. 2015 14:48:35

https://webtrh.cz/diskuse/jak-na-jednoduchy-html-konfigurator-produktu/#reply1104547

i-PRESS

(2 hodnocení)

8. 4. 2015 14:55:41

Na to bych doporučil nějaký famework, třeba KnockoutJS. Ideální řešení formou modelu, kdy se o ty viditelné prvky (selecty, výpis parametrů atd) člověk vůbec nestará. Nejblíže z example je asi shopping cart http://knockoutjs.com/examples/cartEditor.html .

8. 4. 2015 14:55:41

https://webtrh.cz/diskuse/jak-na-jednoduchy-html-konfigurator-produktu/#reply1104546

Gorgonzola73

8. 4. 2015 15:06:13

Napsal malacanek;1184560
Náčrtek se mi nezobrazuje, ale zkusím to teda nějak popsat v kódu.

jQuery:
$('body').on('change', '.mujSelect', function(){ var data = 'data=' $( this + " option:selected" ).val(); $.post('mujskript.php', data, function(data){ $(data).appendTo('#formVeKteremMamSelect'); }); });

PHP:
$data = mysqli::real_escape_string ( $_POST ); // db select //po selectu vytvořím select v html return $html;

Asi nějak takto. Je to narychlo sesmolené, tak je možné, že tam budou chyby, ale jako inspirace by to mělo stačit.

Moc dik za rychlou reakci, bohuzel muj programatorsky "skill" v teto oblasti bude nejspis potrebovat trosku podrobnejsi instruktaz, stale mi neni jasne do opakovane generovani nasledujicich dropdown selectu na zaklade predchoziho vyberu polozky :(

Nacrtek davam jako prilohu:

15100

8. 4. 2015 15:06:13

https://webtrh.cz/diskuse/jak-na-jednoduchy-html-konfigurator-produktu/#reply1104545

Malcánek Jan

(4 hodnocení)

8. 4. 2015 15:11:36

Obávám se, že toto už je spíš na delší studium, nebo do sekce poptávky. Já už to asi lépe v obecné rovině vysvětlit nezvládnu.

8. 4. 2015 15:11:36

https://webtrh.cz/diskuse/jak-na-jednoduchy-html-konfigurator-produktu/#reply1104544

Gorgonzola73

8. 4. 2015 15:12:53

Napsal malacanek;1184574
Obávám se, že toto už je spíš na delší studium, nebo do sekce poptávky. Já už to asi lépe v obecné rovině vysvětlit nezvládnu.

Jasny, asi to tam poptam, i tak moc diky! :)

8. 4. 2015 15:12:53

https://webtrh.cz/diskuse/jak-na-jednoduchy-html-konfigurator-produktu/#reply1104543

Jan Stejskal

(7 hodnocení)

8. 4. 2015 15:21:58

Jediné, co je třeba udělat je zjistit, co uživatel vybral, to odeslat ajaxem a na základě toho vrátit data pro další selectbox. Použijte jquery. Co uživatel vybral zjistíte pomocí .val(). odešlete pomocí ajax:

V msg pak budete mít odpověď, tedy data pro sestavení dalšího selectu. Všechno jsou to základní příklady z dokumentace jquery, jen je třeba tyto tři kroky spojit v jeden. Kód na cca 20 řádků.

8. 4. 2015 15:21:58

https://webtrh.cz/diskuse/jak-na-jednoduchy-html-konfigurator-produktu/#reply1104542

Pro odpověď se přihlašte.

Přihlásit