response moet 1 wezen maar geeft 0 aan
Ik ben bezig met een leuk registratie checkje.
Ik heb deze stukjes:
functions.php(Zitten al mijn functies in.
Code (php)
1
2
3
4
5
6
2
3
4
5
6
<?php
//Registreert gebruiker en checkt of alles goed is gegaan
function registerNewAcc() {
return false;
}
?>
//Registreert gebruiker en checkt of alles goed is gegaan
function registerNewAcc() {
return false;
}
?>
registerHandler.php(Geeft response aan the jquery)
Code (php)
1
2
3
4
5
6
7
8
9
10
11
2
3
4
5
6
7
8
9
10
11
<?php
//Wanneer het formulier goed is
if (registerNewAcc() == false) {
//Als het registreren fout is gegaan
echo '<div class="invisible"></div>';
echo 'fout';
} else {
//Als het registreren goed is gegaan
echo 'You are register succesfull!<br>Check your e-mail, we have send you an e-mail with a verification-link in it to verify your account.';
}
?>
//Wanneer het formulier goed is
if (registerNewAcc() == false) {
//Als het registreren fout is gegaan
echo '<div class="invisible"></div>';
echo 'fout';
} else {
//Als het registreren goed is gegaan
echo 'You are register succesfull!<br>Check your e-mail, we have send you an e-mail with a verification-link in it to verify your account.';
}
?>
form.js(Maak ik de registratie live checks)
Code (php)
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
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
<script type="text/javascript">
//Check hele register formulier
$( "form#registerForm" ).submit(function( event ) {
// Stop form from submitting normally
event.preventDefault();
var $form = $(this);
var $url = "registerHandler.php?action=registerCheck";
var $inputs = $form.find("input");
var posting = $.post($url, $form.serialize());
$inputs.prop("disabled", true);
posting.done(function (data) {
//////////////////////////////////////////////////
var formStatus = $(data).find(".inputCheckCross");
if (formStatus.length >= 1) {
//Wanneer het formulier fout is
$("div.registerError").hide().fadeIn().css("display", "block").empty().append(data);
$("div.statusBalk").css("display", "none");
$("span.inputCheck").empty();
$inputs.prop("disabled", false);
} else {
=============================================
var registerStatus = data.find(".invisible");
if (registerStatus.length >= 1) {
//Kijkt of er regisratie fout is
$("div.statusBalk").hide().slideDown().css("display", "block").css("background-color", "red").empty().append(data);
$("span.inputCheck").empty();
$inputs.prop("disabled", false);
} else {
//Kijkt of er regisratie fout is
$("div.statusBalk").hide().slideDown().css("display", "block").css("background-color", "green").empty().append(data);
$("span.inputCheck").empty();
$inputs.prop("disabled", false);
}
}
});
});
</script>
//Check hele register formulier
$( "form#registerForm" ).submit(function( event ) {
// Stop form from submitting normally
event.preventDefault();
var $form = $(this);
var $url = "registerHandler.php?action=registerCheck";
var $inputs = $form.find("input");
var posting = $.post($url, $form.serialize());
$inputs.prop("disabled", true);
posting.done(function (data) {
//////////////////////////////////////////////////
var formStatus = $(data).find(".inputCheckCross");
if (formStatus.length >= 1) {
//Wanneer het formulier fout is
$("div.registerError").hide().fadeIn().css("display", "block").empty().append(data);
$("div.statusBalk").css("display", "none");
$("span.inputCheck").empty();
$inputs.prop("disabled", false);
} else {
=============================================
var registerStatus = data.find(".invisible");
if (registerStatus.length >= 1) {
//Kijkt of er regisratie fout is
$("div.statusBalk").hide().slideDown().css("display", "block").css("background-color", "red").empty().append(data);
$("span.inputCheck").empty();
$inputs.prop("disabled", false);
} else {
//Kijkt of er regisratie fout is
$("div.statusBalk").hide().slideDown().css("display", "block").css("background-color", "green").empty().append(data);
$("span.inputCheck").empty();
$inputs.prop("disabled", false);
}
}
});
});
</script>
Zoals je ziet in de jquery code de line onder `////////////////////////` is op dezelfde manier uitgevoerd als onder de line `=====================`.
Maar toch op een of andere manier gaat het bij de eerste wel goed en bij de 2e niet.
Want hij hoort bij de tweede een 1 te hebben als result.
Hopelijk hebben jullie een beetje raad hoe ik dit kan oplossen.
Mvg, Mathieu.
Toevoeging op 13/04/2015 20:57:51:
Oke ik heb misschien iets dat nog helpt.
De 1e keer dat ik op submit druk zal de balk groen worden.
Maar wanneer ik voor de 2e keer op de knop druk zal hij rood worden.
Hopelijk hebben jullie hier wat aan.
Gewijzigd op 13/04/2015 20:42:41 door Mathieu Posthumus
#2 De .find() zoekt IN de set gematchte elementen. Omdat je HTML geen omvattende div of element heeft gaat dit wss mis. Als je een div om de te retourneren HTML zet en je $(data).find('.invisible') gebruikt heb je wel een "1" als resultaat, maar
#3 Dit is een brakke manier om te controleren of een registratie geslaagd is; waarom stuur je niet gewoon in JSON een bericht terug in een vaste (fatsoenlijke) structuur met bijvoorbeeld:
- een statuscode (boolean) geslaagd ja ofte nee
- een lap html die je afdrukt
Dan kun je refereren aan je statuscode in plaats van deze status afleiden door het uit je HTML peuteren van een klasse...
Ben nog een leerling en .find() gebruik ik eerder en daar werkt ie wel al gewoon dus hoe zou dat dan zitten.
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<script type="text/javascript">
//<![CDATA[
$().ready(function() {
// vergelijk:
alert($('<div class="findme">hoi</div>').find('.findme').length);
// geeft 0 terug want: root element wordt overgeslagen
// met
alert($(
'<div class="findme">\
<div class="findme">een</div>\
<div>\
<div class="findme">twee</div>\
</div>\
</div>'
).find('.findme').length);
// geeft 2 terug want: inspecteert alle onderliggende niveaus
});
//]]>
</script>
//<![CDATA[
$().ready(function() {
// vergelijk:
alert($('<div class="findme">hoi</div>').find('.findme').length);
// geeft 0 terug want: root element wordt overgeslagen
// met
alert($(
'<div class="findme">\
<div class="findme">een</div>\
<div>\
<div class="findme">twee</div>\
</div>\
</div>'
).find('.findme').length);
// geeft 2 terug want: inspecteert alle onderliggende niveaus
});
//]]>
</script>
Ik moest dus inplaats van registerStatus.length >= 1 naar registerStatus doen.
Heel apart maar want eerder gebruik ik het dus op dezelfde manier bij formStatus
Misschien hebben jullie een idee waarom het bij die eerste wel werkt en bij die 2e niet!
Groet, Mathieu.
Vergelijk:
Met:
In de tweede variant ontbreekt $(...).
Dit is naar mijn mening nog steeds niet echt een goede oplossing waarbij je een status afleid uit een klasse in een plak HTML...
Dat had ik ook geprobeerd was geen optie.