e.preventDefault() met GET values

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Pagina: 1 2 volgende »

Francoi gckx

Francoi gckx

02/01/2014 12:13:51
Quote Anchor link
Situatie:

Ik heb forms voor login en registratie op dezelde pagina waarbij je met een animatie kan switchen tussen die twee.
Bij het switchen krijgt een van die forms een class active.

Maar door e.preventDefault() toegepast op de 'switcher link' kan ik geen get values in de url toevoegen.

Voorbeeld.

De eerste form die je te zien krijgt is de login form en die is active op de form heb je 'switcher link':
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
<a href="login.php?f=register" rel="register" class="linkform">Nog geen account? Registreer hier</a>

Alleen nu gaat de get value f verloren en kan ik voor PHPserver niet bepalen welke active is.
En door e.preventDefault() weg te halen werkt de animatie niet meer.

Een tip?
 
PHP hulp

PHP hulp

29/03/2024 11:31:36
 
Frank Nietbelangrijk

Frank Nietbelangrijk

02/01/2014 12:43:18
Quote Anchor link
Geef beide forms een hidden field:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
<!-- login form -->
<input type="hidden" name="form_type" value="login" >
<!-- registratie form -->
<input type="hidden" name="form_type" value="register" >


dan in PHP:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
<?
if($_SERVER['REQUEST_METHOD'=='POST')
{

    if(isset($_POST['form_type']) && $_POST['form_type'] == 'login')
    {

        // hier de login afhandeling
    } else if(isset($_POST['form_type']) && $_POST['form_type'] == 'register')
    {

        // hier de registratie afhandeling
    } else {
        // ongeldige aktie
    }
}

?>


Toevoeging op 02/01/2014 12:54:09:

laat die formulieren eens zien?
 
Francoi gckx

Francoi gckx

02/01/2014 12:58:22
Quote Anchor link
Sorry aan jou reactie te zien heb ik het denk niet goed uitgelegd.

Bepalen welke form ik moet afhandelen of register of login is geen probleem want dat kan ik ook bepalen
met de submit knop door voor register en login beide een andere name te geven.

i.e
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
<input type="submit" value="Register" name="register" />


Ik bedoel meer dat je begint bij login die heeft als eerste de class active.
Maar als je dan op de link "Geen account klik hier om te registreren" klikt krijg je een overgangs animatie naar de registratie form.
En dit heb ik niet goed uitgelegd, het probleem is, als ik refresh of submit op de registratie form dat het dan weer springt naar de login pagina. Dus ik moet op de 'switcherlink' een get value meegeven zodat ik de class active MET php kan manipuleren
 
Kris Peeters

Kris Peeters

02/01/2014 13:16:00
Quote Anchor link
Kan je wat code tonen?
Een functie waar je e.preventDefault() gebruikt.
 
Francoi gckx

Francoi gckx

02/01/2014 13:17:32
Quote Anchor link
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
$linkform.bind('click',function(e){
                    var $link    = jQuery(this);
                    var target    = $link.attr('rel');
                    $currentForm.fadeOut(400,function(){
                        //remove class active from current form
                        $currentForm.removeClass('active');
                        //new current form
                        $currentForm= $form_wrapper.children('form.'+target);
                        //animate the wrapper
                        $form_wrapper.stop()
                                     .animate({
                                        width    : $currentForm.data('width') + 'px',
                                        height    : $currentForm.data('height') + 'px'
                                        
                                     },500,function(){
                                        //new form gets class active
                                        $currentForm.addClass('active');
                                        //show the new form
                                        $currentForm.fadeIn(400);
                                     });
                    });
                    e.preventDefault();
                    
                });
 
Kris Peeters

Kris Peeters

02/01/2014 13:28:05
Quote Anchor link
Wat voor element is $linkform?
is dat die <a href="login.php?f=register" rel="register" ...> ?

--

Je wil dus die rel="register" lezen van die <a>.
Wat moet dan gebeuren met die "register"? Hoe wil je die in de url krijgen?

(een beetje anticiperend)
Je weet: als de url veranderd wordt, wordt de pagina verlaten, en begint alle javascript opnieuw.

Behalve: je mag aan het einde van een url een # zetten, met gelijk welke string daarna. Dit zorgt niet voor een verversing van de pagina.
Dit is ideaal wanneer je javascript toestanden in de url wil steken.
 
Francoi gckx

Francoi gckx

02/01/2014 13:39:56
Quote Anchor link
$linkform = $form_wrapper.find('.linkform') dus <a href="login.php?f=register" rel="register" class="linkform">

Met e.preventDefault(); blijft die op de pagina en dat is goed anders werkt inderdaad de javascript voor de overgangs animatie niet en dat is goed hij hoort ook opzelde pagina te blijven.

Als ik naar de registratie form ga, moet hij naar: login.php?f=register gaan in plaat daar van gaat hij naar login.php dit geeft problemen voor de submit en browser refresh op de register pagina.

Hoe kan ik nou toch zorgen dat die op de registratie pagina blijft ondanks e.preventDefault()

Mij idee was ik geef op de link een get value mee <a href="login.php?f=register" ...</a> zodat ik in php kan zeggen
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
<form class="register
<?php
    if($_GET['f'] == 'register')
        {

            echo ' active';
        }

?>

                        " method="post" action="">
 
Erwin H

Erwin H

02/01/2014 13:41:22
Quote Anchor link
In dit geval lijkt me een cookie een betere oplossing. Plaats in javascript een cookie met daarin het laatst actieve form. In php lees je dat cookie uit en zorg je ervoor dat het juiste form zichtbaar wordt. Hoef je ook geen nieuwe url aan te maken, want dat zorgt alleen maar voor onduidelijkheid voor de gebruiker (tenzij je vanaf andere pagina's direct naar de ene of de andere wilt kunnen linken).
 
Kris Peeters

Kris Peeters

02/01/2014 13:43:50
Quote Anchor link
Francoi gckx op 02/01/2014 13:39:56:
... Als ik naar de registratie form ga, moet hij naar: login.php?f=register gaan in plaat daar van gaat hij naar login.php ...


Hoe gebeurt dat?
Waar/hoe wordt de gebruiker doorgestuurd naar login.php?
De functie die je postte doet de animate en de add active ...
Wie zorgt er voor de doorverwijzing?
 
Francoi gckx

Francoi gckx

02/01/2014 13:50:24
Quote Anchor link
@Erwin H dat zou een goeie oplossing kunnen zijn dus ik heb dit zover
Een aanpassing van code die ik boven al heb gegeven
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
$linkform.bind('click',function(e){
                    var $link    = jQuery(this);
                    var target    = $link.attr('rel');
                    $currentForm.fadeOut(400,function(){
                        //remove class active from current form
                        $currentForm.removeClass('active');
                        //new current form
                        $currentForm= $form_wrapper.children('form.'+target);
                        //animate the wrapper
                        $form_wrapper.stop()
                                     .animate({
                                        width    : $currentForm.data('width') + 'px',
                                        height    : $currentForm.data('height') + 'px'
                                        
                                     },500,function(){
                                        //new form gets class active
                                        $currentForm.addClass('active');
                                        //show the new form
                                        $currentForm.fadeIn(400);
                                     });
                    });
                    document.cookie= $('form').attr('class');
                    e.preventDefault();
                    
                });


Hoe kom ik nu in PHP terecht om de cookie uit te lezen


@Kris Je moet begrijpen login.php bevat drie forms in een: 'login, register, en wachtwoord vergeten'

De 'login' form is wat je als eerst te zien krijgt op de login.php pagina van daaruit kan je switchen naar de 'register' form. Dus de 'login' form heeft altijd de class='active' hardcoded. Als je naar de 'register' form gaat krijgt de 'register' form via javascript de class='active' en de 'login' form niet meer.

Alleen PHP begrijpt dat niet voor PHP is 'login' form nog steeds 'active' dit geeft problemen bij submit en refreshen van de 'register' form

toevoeging op de laatste zin: en dus gaat hij terug naar de 'login' form
Gewijzigd op 02/01/2014 14:07:36 door Francoi gckx
 
Erwin H

Erwin H

02/01/2014 14:40:39
Quote Anchor link
Pas je cookie setter iets aan ('form' is nu je cookie naam):
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
document.cookie= 'form='+$('form').attr('class');

En dan in php kan je die uitlezen via:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
<?php
$_COOKIE
['form'];
?>
Gewijzigd op 02/01/2014 16:34:23 door Erwin H
 
Francoi gckx

Francoi gckx

02/01/2014 17:06:20
Quote Anchor link
Hmm ik dacht dat zou werken Erwin H ik moet toch een andere oplossing vinden.
Hij gaat nu niet meer naar de registratie form als ik op de link klikt, geen idee waarom niet.
Voordat je daar op in gaat kan jij hier iets mee

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
$form_wrapper.find('input[type="submit"]')
                             .click(function(e){
                                return false;
                             });


Alleen als ik op de submit knop klikt verwerkt php de code weer niet
 
Erwin H

Erwin H

02/01/2014 17:08:47
Quote Anchor link
En aangezien je elke keer maar halve code geeft, kunnen wij er ook geen soep van maken. Wees alsjeblieft eens een keer duidelijk en volledig als je echt geholpen wil worden.
 
Francoi gckx

Francoi gckx

02/01/2014 17:16:50
Quote Anchor link
Ik heb dus

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
...
......
...
$linkform.bind('click',function(e){
                    var $link    = jQuery(this);
                    var target    = $link.attr('rel');
                    $currentForm.fadeOut(400,function(){
                        //remove class active from current form
                        $currentForm.removeClass('active');
                        //new current form
                        $currentForm= $form_wrapper.children('form.'+target);
                        //animate the wrapper
                        $form_wrapper.stop()
                                     .animate({
                                        width    : $currentForm.data('width') + 'px',
                                        height    : $currentForm.data('height') + 'px'
                                        
                                     },500,function(){
                                        //new form gets class active
                                        $currentForm.addClass('active');
                                        //show the new form
                                        $currentForm.fadeIn(400);
                                     });
                    });
                    document.cookie= 'form='$('form').attr('class');
                    e.preventDefault();
                    
                });
                
                function setWrapperWidth(){
                    $form_wrapper.css({
                        width    : $currentForm.data('width') + 'px',
                        height    : $currentForm.data('height') + 'px'    
                    });
                    $entrycontent.css({
                        height    : $entrycontent.height() + $currentForm.data('height') + 100 + 'px'    
                    });
                }
                
                $form_wrapper.find('input[type="submit"]')
                             .click(function(e){
                                return false;
                             });
                jQuery('#btn-bedrijf').click(function() {
                    jQuery("#bedrijf_fields").slideToggle("fast")
            
                                    
                return false;    
                });
            });




Toevoeging op 02/01/2014 17:19:01:

MET document.cookie= 'form='$('form').attr('class'); blokkeert heel de code javascipt (waarschijnlijk) en kom ik niet naar de registratie formulier

MET
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
$form_wrapper.find('input[type="submit"]')
                             .click(function(e){
                                return false;
                             });


Blijft die op de registratie form maar verwerkt PHP de gegevens niet

Ik zal zo de html form zelf geven

Toevoeging op 02/01/2014 17:22:06:

Dit is een gedeelte en het hele form van login voor de registratieform is het ongeveer hetzelfde qua structuur alleen zonder de class active hardcoded

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
<form class="login
                        active" method="post" action="">
                        <h3>Login</h3>
<?php
if(empty($errors) === false)
    {

    
        echo '<div class="field-box"><span class="errors">', implode('<br />', $errors), '</span></div>';    
    
    }

?>

                        <div>
                        <label>Gebruikersnaam:</label>
                        <input type="text" name="username" value="<?php if(isset($_POST['username'])) echo htmlentities($_POST['username']); ?>" />
                        <span class="error"></span>
                        </div>
                        <div>
                        <label>Wachtwoord: <a href="login.php" rel="forgot_password" class="forgot linkform">Wachtwoord vergeten?</a></label>
                        </div>
                        <div>
                        <input type="password" name="password" />
                        <span class="error"></span>
                        </div>
                        <div class="end_forms">
                        <div class="bottom_edited">
                        <div class="remember"><input type="checkbox" /><span>Hou mij ingelogd</span></div>
                        <input type="submit" value="Login" name="login"></input>
                        <a href="login.php?f=register" rel="register" class="linkform">Nog geen account? Registreer hier</a></div>
                        </div>
                        </form>
 
Erwin H

Erwin H

02/01/2014 17:24:02
Quote Anchor link
Hier stond in mijn code in elk geval een foutje (inmiddels veranderd, maar bij jou nog wel):
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
document.cookie= 'form='$('form').attr('class');
//moet zijn:
document.cookie= 'form='+$('form').attr('class');

Verder heb je in datzelfde stuk een probleem met de jquery selector (denk ik), want je hebt eerder gezegd dat je meerdere forms in hetzelfde document heb zitten. Hier selecteer je op alleen de form tag, dus worden alle forms geselecteerd. Je wil alleen het form hebben waarvan op de button is geklikt (lijkt mij...).

En waarom deze click handler, wat wil je hiermee bereiken?
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
$form_wrapper.find('input[type="submit"]').click(function(e){
  return false;
});
 
Francoi gckx

Francoi gckx

02/01/2014 17:34:35
Quote Anchor link
Ik heb de fout veranderd en de click handler ook weggehaald

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
document.cookie= 'factive='+jQuery('form').attr('class');

if(empty($_COOKIE['factive']) === false)
    {
        echo $_COOKIE['factive'];
    }


geeft Undefined



Toevoeging op 02/01/2014 17:35:27:

(Ik ben op het moment zelf ook aan het zoeken) ;)
 
Erwin H

Erwin H

02/01/2014 17:36:11
Quote Anchor link
Je zit nog steeds met die selector voor het form. Die vraagt nu elk form op en je krijgt dus de waarde van de laatste.
 
Francoi gckx

Francoi gckx

02/01/2014 17:39:20
Quote Anchor link
Hmm id aan de <form class="register" ... > toevoegen dan en dan
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
document.cookie= 'factive='+jQuery('#id').attr('class');
                    console.log('factive');

?

Toevoeging op 02/01/2014 17:42:11:

Ik heb geen selector die de forms van elkaar onderscheiden

Toevoeging op 02/01/2014 17:44:58:

Ben het een beetje kwijt even wat anders doen:)
 
Erwin H

Erwin H

02/01/2014 17:50:12
Quote Anchor link
Je hoeft volgens mij dat form helemaal niet te selecteren. Wat je wil in dat cookie is het form stoppen waar de user naartoe gaat. Dus elke keer als de user van form verandert wil je het nieuwe form hebben. Volgens mij kan je in het cookie dus de waarde van 'target' stoppen. Die waarde gebruik je namelijk ook om naar het form te gaan via je animatie.
 
Francoi gckx

Francoi gckx

02/01/2014 18:10:20
Quote Anchor link
Dat klinkt inderdaad heel erg logisch


Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
$linkform.bind('click',function(e){
                    var $link    = jQuery(this);
                    var target    = $link.attr('rel');
                    $currentForm.fadeOut(400,function(){
                        //remove class active from current form
                        $currentForm.removeClass('active');
                        //new current form
                        $currentForm= $form_wrapper.children('form.'+target);
                        console.log($currentForm);
                        document.cookie= 'factive=' + $currentForm;
                        //animate the wrapper
                        $form_wrapper.stop()
                                     .animate({
                                        width    : $currentForm.data('width') + 'px',
                                        height    : $currentForm.data('height') + 'px'
                                        
                                     },500,function(){
                                        //new form gets class active
                                        $currentForm.addClass('active');
                                        //show the new form
                                        $currentForm.fadeIn(400);
                                     });
                    });
                    
                    e.preventDefault();
                    
                });



Php output is: object Object
ConsoleLog is: jQuery(form.register)

Toevoeging op 02/01/2014 18:11:47:

Ben even snel eten, dan kan ik weer met volle concentratie er tegenaan
Gewijzigd op 02/01/2014 18:10:50 door Francoi gckx
 
Erwin H

Erwin H

02/01/2014 18:28:40
Quote Anchor link
Nee, niet $currentForm, dat is een jquery object, gewoon target. Die variabele heeft als waarde de class van het form waar je naartoe wilt. Dat is ook wat je in php wilt hebben om te kunnen weten welk form geactiveerd moet worden.
 

Pagina: 1 2 volgende »



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.