Hallo,

Kan iemand mij uitleggen hoe AJAX werkt, of een link sturen met uitleg zodat ik mijn login systeem met AJAX kan maken. Zelf weet ik nog niet zo goed hoe AJAX werkt en ik zou het graag willen leren.

<script>
			$(document).ready(function(){
			$("#add_err").css('display', 'none', 'important');
			 $("#login").click(function(){	
				  username=$("#name").val();
				  password=$("#word").val();
				  $.ajax({
				   type: "POST",
				   url: "paneel/include/login.php",
					data: "name="+username+"&word="+password,
				   success: function(html){    
					if(html=='true')    {
					 window.location="dashboard.php";
					}
					else    {
					$("#add_err").css('display', 'inline', 'important');
					 $("#add_err").html("Foutieve login gegevens.");
					}
				   },
				   beforeSend:function()
				   {
					$("#add_err").css('display', 'inline', 'important');
					$("#add_err").html("Controleren...")
				   }
				  });
				return false;
			});
		});
		</script>

Dit heb ik nu, dit werkt ook. Alleen nog even vinden hoe de error na x seconden weg gaat.. en dat als die weg is, dat die weer kan komen
Een setTimeout doet wonderen.

setTimeout(function(){
  $('#add_err').remove();
}, 5000);

het getal is in milliseconden, dus hier is het 5 seconden.
Maar zelf ben ik niet zo van de verdwijnende errors. Als iemand even zijn hoofd omdraait kan hij de error missen, wat verwarring oplevert. Bouw dan een kruisje met een .remove() in.
Thnx! Ik zal eens even kijken naar dat kruisje :D Zelf dacht ik aan een snackbar voor de error melding
Een snackbar :-P ?
Hmm, het kruisje lijkt niet te werken.

		<script>
			$(document).ready(function(){
			$("#add_err").css('display', 'none', 'important');
			 $("#login").click(function(){	
				  username=$("#name").val();
				  password=$("#word").val();
				  $.ajax({
				   type: "POST",
				   url: "paneel/include/login.php",
					data: "name="+username+"&word="+password,
				   success: function(html){    
					if(html=='true')    {
					 window.location="dashboard.php";
					}
					else    {
					$("#add_err").css('display', 'inline', 'important');
					 $("#add_err").html('Foutieve login gegevens. <button onclick="closeWindow()" >X</button>');
					 var x = document.getElementById("add_err")
					    x.className = "show";
					}
				   },
				   beforeSend:function()
				   {
					$("#add_err").css('display', 'inline', 'important');
					$("#add_err").html("Controleren...")
				   }
				  });
				return false;
			});
		});
			function closeWindow() {
			 function(){ x.className = x.className.replace("show", ""); };
			}
		</script>

Heb ik de functie closeWindow() goed aangegeven en goed uitgevoert? of ligt het bij onclick="closeWinodw()" het probleem? De code wat het nu is, opent niet meer de snackbar.

[size=xsmall]Toevoeging op 25/12/2016 13:19:49:[/size]

- Ariën - op 25/12/2016 13:01:18

Een snackbar :-P ?


Jaa! die (vind ik) heel mooi.
Ik vind het zelf niet echt netjes om jQuery elementen en de standaard document-objecten door elkaar heen te gebruiken. jQuery is in mijn ogen het makkelijkste om je DOM mee te beïnvloeden. Verder is een CloseWindow niet echt het juiste wat je zoekt. Je wilt een divje verwijderen, en niet een heel venster/window.

Ik snap overigens alleen niet wat je met Snackbar bedoeld? Of je moet een site voor een snackbar bouwen. Of het zal wel een verzonnen buzzword zijn voor iets ;-).
- Ariën - op 25/12/2016 13:19:55

Ik vind het zelf niet echt netjes om jQuery elementen en de standaard document-objecten door elkaar heen te gebruiken. jQuery is in mijn ogen het makkelijkste om je DOM mee te beïnvloeden. Verder is een CloseWindow niet echt het juiste wat je zoekt. Je wilt een divje verwijderen, en niet een heel venster/window.


Wat zou ik dan moeten gebruiken? :P :S (Het moet (als de div verwijderd is) wel weer terug moeten komen zonder page reload)
Dat heb ik al uitgelegd ;-)
Die setTimeout kan je uiteraard vergeten. Lees ook eens deze manual over .remove()
- Ariën - op 25/12/2016 13:21:52

Dat heb ik al uitgelegd ;-)
Die setTimeout kan je uiteraard vergeten. Lees ook eens deze manual over .remove()


Hiermee moet ik de page reloaden, anders krijg ik na dat de melding verwijderd is de error niet meer Laatmaar :P moest .removeClass zijn ;S
.remove() reloadt niks hoor. ;-)

Misschien anders even een basistutorial jQuery doen, in plaats van wat aanrommelen. Want ik heb het idee dat je maar wat dingen probeert, zonder precies te weten wat ze doen.

Reageren