Twitter Bootstrap - ajaxové zpracování formuláře z modálního okna – JavaScript, AJAX, jQuery – Fórum – Programujte.com
 x   TIP: Přetáhni ikonu na hlavní panel pro připnutí webu
Reklama
Reklama

Twitter Bootstrap - ajaxové zpracování formuláře z modálního okna – JavaScript, AJAX, jQuery – Fórum – Programujte.comTwitter Bootstrap - ajaxové zpracování formuláře z modálního okna – JavaScript, AJAX, jQuery – Fórum – Programujte.com

 

Hledá se programátor! Plat 1 800 € + bonusy (firma Boxmol.com)
Paja2
~ Moderátor
+2
Věrný člen
11. 11. 2013   #1
-
0
-

Zdravím,
mám tuto stránku http://studenti.hetsmek.net/…eni-slovicko.

Po kliknutí na TEST č. 0 se zobrazí modální okno. MOhl by mi někdo poradit jak formulář, který je v modálním okně zpracovat pomocí ajaxu ? Potřebuji, aby po odeslání formuláře nedošlo k refreshi původní stránky

Na výše uvedeném odkaze jsem zkoušel zpracovat formulář pomocí ajaxu, ale zpracování funguje jen při prvotním načtení stránky.

Můžete mi prosím někdo poradit jak problém vyřešit. Děkuji

Nahlásit jako SPAM
IP: 217.112.164.–
Reklama
Reklama
Ericsko+3
Stálý člen
11. 11. 2013   #2
-
0
-

#1 Paja2
Linka nefunguje

Nahlásit jako SPAM
IP: 88.212.34.–
Paja2
~ Moderátor
+2
Věrný člen
11. 11. 2013   #3
-
0
-
Nahlásit jako SPAM
IP: 31.134.216.–
Ericsko+3
Stálý člen
11. 11. 2013   #4
-
+1
-
Zajímavé

Pšíteli, máš v tom taký binec, že jednoduchšie by mi bolo celé to napísať odznovu.

Bootstrap sice pouzivas, ale skor ti je na pritaz, ako by si z neho ozaj tazil.

Problem mas v scripte: modal/chybovost-slovicko.php

Totiz na odoslanie ajaxom sa ti nepouzije ajax v index.php, ale ten druhy.

V index.php sice mas e.preventDefault() na zabranenie default akcie <a>, ale v tom druhom (modal/chybovost-slovicko.php) ti to chyba.

Neviem, co ta vedie, k takejto prasarni, ale doporucujem nastudovat viac z kazdeho (html, javascript, aj boostrap ako taky).

Ako rozcvicka dobre, ale keby som mal po tebe robit code review, tak to ti radsej odporucim, aby si si hladal inu pracu ;)

Nahlásit jako SPAM
IP: 88.212.34.–
Paja2
~ Moderátor
+2
Věrný člen
11. 11. 2013   #5
-
0
-

#4 Ericsko
OK, díky za info. Budu rád, když mě obohatíš o nějaké dobré praktické rady. Prasárnou myslíš ty dva ajaxy ? Klidně si to přepíši do lepší podoby, byl bych rád kdyby jsi mi v tomto směru poradila :-), přeci jen máš více zkušeností...a co se týče bootstrapu tak já teprve zkušenosti sbírám

Nahlásit jako SPAM
IP: 31.134.216.–
Ericsko+3
Stálý člen
12. 11. 2013   #6
-
0
-

Takto, ide o to, ze takyto pristup je velmi neprehladny a tazko sa ladi.

Ak na to nemas specialny dovod, je dobre javascript volat z toho scriptu, v ktorom otvaras ten modal.

Od zaciatku by som ti doporucil oddelovat html, javascript a css, takze skus cely javascript aj css dat do zvlastneho suboru. V html budes mat teda samotnu stranku a modal okno, ktore skryjes (css display: none)

Do dalsej casti html si das jednotlive obsahy (tiez skryte), ktore chces mat v modalnom okne, tie si budes javascriptom davat do modal-header a modal-body, podla toho, na ktoru otazku klikas. Napr:

<div id="test0" class="hidden" data-id="0">
  <div class="header">Nadpis ulohy</div>
  <div class="body">
    <h2>Zvolte prosím chybovou tolerancí ke slovíčku <strong></strong></h2>
      <p class="text-center">
        <label class="radio-inline">
          <input type="radio" id="radio1" value="-2" name="chybovost">-2
        </label>
        <label class="radio-inline">
          <input type="radio" id="radio1" value="-1" name="chybovost">-1
        </label>
        <label class="radio-inline">
          <input type="radio" id="radio1" value="0" name="chybovost">0
        </label>
        <label class="radio-inline">
          <input type="radio" id="radio1" value="1" name="chybovost">1
        </label>
        <label class="radio-inline">
          <input type="radio" id="radio1" value="2" name="chybovost">2
        </label>
      </p>

  </div>
</div>

Ak chces submitovat formular do php, mozes pouzit standardne key=value pary, alebo este lepsie submitnut JSON objekt, cize si zostavis data z jednotlivych radio buttonov.

V php subore potom submitnute data precitas a ulozis do db, alebo kam chces. Ako odpoved vratis rovnako JSON objekt, napr. {"success":"true", "message":"Data ulozene"}, tu mozes potom precitat v AJAX callbacku a pripadne zobrait uzivatelovi (napr. pomocou Bootstrap alert).

Zatial tolko ako navod, ak potrebujes s niecim pomoct, kludne sa ozvi.

Nahlásit jako SPAM
IP: 88.212.34.–
Paja2
~ Moderátor
+2
Věrný člen
13. 11. 2013   #7
-
0
-

#6 Ericsko
Děkuji, já to v současné době mám tak že modální okna včetně obsahu mám ve složce /modal a pomocí ajaxu si načítám modální okno které potřebuji. Chtěl jsem, aby obsah modálních oken byl raději umístěn zvlášť

Samozřejmě že ty kody ještě pročistím aby bylo samostatně html, css a js

Mohl by jsi mi třeba poslat i nějakou praktickou ukázku ? Rád se poučím a naberu zkušenosti od profíka  

Nahlásit jako SPAM
IP: 178.20.137.–
Paja2
~ Moderátor
+2
Věrný člen
13. 11. 2013   #8
-
0
-

#6 Ericsko
Bylo by možné získat na tebe nějaký kontakt (skype, icq či e-mail) pro případné dotazy ?

Děkuji

Nahlásit jako SPAM
IP: 31.134.216.–
Ericsko+3
Stálý člen
13. 11. 2013   #9
-
0
-

#8 Paja2
V profile mam web, tam najdes contact form.

Nahlásit jako SPAM
IP: 88.212.34.–
Zjistit počet nových příspěvků

Přidej příspěvek

Toto téma je starší jak čtvrt roku – přidej svůj příspěvek jen tehdy, máš-li k tématu opravdu co říct!

Ano, opravdu chci reagovat → zobrazí formulář pro přidání příspěvku

×Vložení zdrojáku

×Vložení obrázku

Vložit URL obrázku Vybrat obrázek na disku
Vlož URL adresu obrázku:
Klikni a vyber obrázek z počítače:

×Vložení videa

Aktuálně jsou podporována videa ze serverů YouTube, Vimeo a Dailymotion.
×
 
Podporujeme Gravatara.
Zadej URL adresu Avatara (40 x 40 px) nebo emailovou adresu pro použití Gravatara.
Email nikam neukládáme, po získání Gravatara je zahozen.
-
Pravidla pro psaní příspěvků, používej diakritiku. ENTER pro nový odstavec, SHIFT + ENTER pro nový řádek.
Sledovat nové příspěvky (pouze pro přihlášené)
Sleduj vlákno a v případě přidání nového příspěvku o tom budeš vědět mezi prvními.
Reaguješ na příspěvek:

Uživatelé prohlížející si toto vlákno

Uživatelé on-line: 0 registrovaných, 15 hostů

 

Hostujeme u Českého hostingu       ISSN 1801-1586       ⇡ Nahoru Webtea.cz logo © 20032016 Programujte.com
Zasadilo a pěstuje Webtea.cz, šéfredaktor Lukáš Churý