Jquery vraagje [opgelost/solved]

[HarmO]

Ik moet een functie maken in een (duitse) website die postcode vraagt en aan de hand van deze postcode een pagina laad met ?showtemplate=false in de url en de inhoud ervan dan in de modal popup toont.

Ik ben echter geen jquery specialist. Mijn jquery code staat op jsfiddler
http://jsfiddle.net/imperbel/xXXc3/

Ik zou feedback apprecieren.
(oplossing zal hier op het forum geplaats worden zodat iedereen het kan terugvinden)

[Rolf]

Heb je hier wat aan? https://www.cmscanbesimple.org/blog/for ... modal-view

[HarmO]

dat is me al gelukt http://forum.cmsmadesimple.org/viewtopi ... 13&t=67422

Maar hier moet eerst een form ingevuld worden waarna een modal popup lanceert met de juist inhoud.

[velden]

Je uitleg is nogal vaag. Het voorbeeld op jsfiddle doet volgens mij ook niets.

Wie of wat gaat dat form afhandelen, hoe weet het Javascript dingetje welke pagina geladen moet worden?

Maak een stappenplan voor jezelf en probeer dat zo goed mogelijk uit te schrijven zodat wij het ook zouden begrijpen.

[HarmO]

• stap 1: valideer het veld (duitse postcode = 5 cijfers)
• stap 2: detecteer aan de hand van de eerste 2 cijfers van de postcode welke vertegenwoordiger
• stap 3: popup modal met inhoud van desbetreffende pagina.

heb al bijna afgewerkt, maar de is traag en blijft hangen op het einde.

HTML

Code: Select all

<h4>VachBerater</h4>
<p>Finden Ihre Ansprechpartner</p>
<form method="post" id="plzform">
<div class="row collapse">
<div class="small-10 columns"><input type="text" id="plz" name="plz" /></div>
<div class="small-2 columns"><button class="postfix button secondary radius"><img src="/template/img/search2.png" alt="" /></button></div>
</div>
</form>

Javascript

Code: Select all

	<__script__>
	  $(document).foundation();

 {literal} function preparePlz() {
        $('#plzform').on("submit", function (event) {
            event.preventDefault();
            var plzVal = $('#plz').val();
            var regex = new RegExp("^([0-9]{5})$");
            if (!regex.test(plzVal)) {
                $('.errormessage').addClass("error");
                if ($('.errormessage').hasClass("hide")) {
                    $('.errormessage').removeClass("hide");
                }
                $("#plz ").addClass("error");
            }
            else if(regex.test(plzVal)) {
                $('.errormessage').addClass("hide");
                $('.errormessage').removeClass("error");
                $('#plz').removeClass("error");
                $('#message').removeClass("hide");
                var plzZone = plzVal.substring(0, 2);
                $('#plzModal').foundation('reveal', 'open', {
                    url: 'http://vaeplan.com/kontact/zone',
                    data: {showtemplate: false, r: plzZone}
                });
            }
        });
        preparePlz();
    }
    $(document).ready(function () {
        preparePlz();
    });
{/literal}	</__script>

[velden]

Ik kan hier niet veel uithalen. Ziet er op zich goed uit volgens mij:

Vind dit wel een vreemde keuze:

Code: Select all

else if(regex.test(plzVal))

Lijkt me dat

Code: Select all

else 

wel volstaat maar dat is het probleem niet.

Heb je link naar de betreffende pagina?

[HarmO]

blijkbaar zat er een loop in mijn functie.

is opgelost.