Scripts
Postcode, adres auto aanvullen formulier
Hallo allemaal, Ik heb het eindelijk voor elkaar gekregen om via Ajax legaal automatisch een adres toe te voegen aan je formulier. Ten eerste dien je een account aan te maken op: https://api.postcode.nl/ Hier krijg je dan gratis een Key en een Secret voor de API. Houd er wel rekening mee dat het script alleen werkt op het domein die je hebt opgegeven bij Postcode.nl Kijk hier voor werkende versie!
index.php
[code]<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
$('#submit').click(function() {
var postc = $('#postc').val();
var huisnr = $('#huisnr').val();
if(!postc || !huisnr) {
alert("Je moet wel een postcode EN huisnr invullen.");
}
else {
$.ajax({
url: 'postcodeCheck.php',
type: 'GET',
dataType: 'json',
data: 'postc=' + postc + '&huisnr=' + huisnr,
success: function(result) {
if(result.postcode == postc) {
$('#woonp').val(result.city);
$('#adres').val(result.street);
$('#provincie').val(result.province);
}
else {
alert('Postcode bestaat niet');
}
},
});
return false;
}
});
jQuery('input[name="postc"]').keyup(function() {
var length = $(this).val().length;
if(length <= 4) {
var num = jQuery(this).val().substring(0,4);
var return_num = num.replace(/[^0-9]/g,'');
jQuery(this).val(return_num);
}
else {
var num = jQuery(this).val().substring(0,4);
var alph = jQuery(this).val().substring(2,6);
var return_alph = alph.replace(/[^a-zA-Z]/g,'');
jQuery(this).val(num + '' + return_alph);
}
});
});
</script>
<form id="form" name="form" method="post">
<h1>Vul je postcode en huisnummer in</h1>
Postcode EN huisnr, anders doet ie het nie :)<br><br><br>
<label for="postc">Postcode:</label>
<input type="text" id="postc" name="postc" maxlength="10" placeholder="1234AB">
<label for="huisnr">Huisnummer:</label>
<input type="text" id="huisnr" name="huisnr">
<input type="submit" id="submit" name="submit" value="Zoeken">
<hr>
<label for="adres">Adres:</label>
<input type="text" id="adres" name="adres" disabled>
<label for="woonp">Woonplaats:</label>
<input type="text" id="woonp" name="woonp" disabled>
<label for="provincie">Provincie:</label>
<input type="text" id="provincie" name="provincie" disabled>
</form>[/code]
postcodeCheck.php
<?php
if(basename($_SERVER['PHP_SELF']) == basename(__FILE__)):
if($_SERVER['REQUEST_METHOD'] == 'GET'):
$curl = curl_init();
curl_setopt($curl, CURLOPT_URL, 'https://api.postcode.nl/rest/addresses/'.$_GET['postc'].'/'.$_GET['huisnr']);
curl_setopt($curl, CURLOPT_HTTPAUTH, CURLAUTH_ANY);
curl_setopt($curl, CURLOPT_RETURNTRANSFER, TRUE);
curl_setopt($curl, CURLOPT_USERPWD, "Key:Secret"); // Hier dus je key en secret van postcode.nl
$return_data = curl_exec($curl);
curl_close($curl);
print $return_data;
else:
header("Location: /");
endif;
else:
header("Location: /");
endif;
?>
Reacties
0