Ik heb een index.php en een save.php.

Op mijn index.php staat een tekstvak.
Hoe kan ik met jquery maken dat er een seintje gaat naar save.php (met de post data) als er iets verandert in het tekstvak?
Als er wat veranderd moet worden, dan zou ik een knop gebruiken, of een blur event.
In dit voorbeeld een knop:

$(document).ready(function(){

	$("button").click(function(){
 	   $.ajax({
		method: "POST",
		url: "script.php", 
		success: function(result){
     	   	$("#result").html("Het bericht is geplaatst!");
    			}
		error:function (xhr, ajaxOptions, thrownError){
			$("#result").html('Fout:'+ xhr.status + ' '+ thrownError);
			}    
		});
	});
});


En in een HTML-element (div, span, wat je maar wilt) met het id result zal dan het resultaat staan.
Je PHP-script zorgt uiteraard voor de opslag van je data.
Ik gebruik dit met blur event;


    <script>
$(document).ready(function(){
    $("input").blur(function(){
        alert("This input field has lost its focus.");
    });
});
</script>


Is het ook mogelijk om alleen bepaalde tekstvakken zo te laten werken? Dus bijvoorbeeld alleen een tekstvak wat 'naam' heet?
Ja, koppel deze functionaliteit aan een class of wellicht beter, een id.

Ik zou je ook aanraden om een timeout in te bouwen. En dit niet per se aan een "blur" te koppelen. Als je namelijk dit tekstveld nooit verlaat als je iets hebt aangepast, en dan wegnavigeert van je pagina zijn de wijzigingen niet opgeslagen.

Ook zou je in JavaScript kunnen tracken of er daadwerkelijk iets is veranderd in je invoer. Dit beide om het aantal onnodige of overbodige wegschrijfacties te minimaliseren.

En ook zou je visueel kunnen maken dat iets is opgeslagen, zodat het ook duidelijk is dat de wijziging permanent is.

Reageren