Laat jquery op file extensie controleren
Ik loop even helemaal vast op het controleren van de file extensie.
Ik krijg steeds return false terug op een of andere manier.
//snelle HTML gemaakt
Code (php)
1
2
2
<input type="file" id="file_field">
<div class="send">Verzend</div>
<div class="send">Verzend</div>
//Jquery code
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
$(".send").click(function(e){
var checkfile = $('#file_field').val();
if (validateFile(checkfile)) {
alert ("good");
}else{
alert ("wrong");
e.preventDefault();
}
});
//filter karakters email
function validateFile(checkfile) {
var filter = /([^s]+(?=.(jpg|gif|png)).2)/gm;
if (filter.test(checkfile)) {
return true;
}
else {
return false;
}
}
var checkfile = $('#file_field').val();
if (validateFile(checkfile)) {
alert ("good");
}else{
alert ("wrong");
e.preventDefault();
}
});
//filter karakters email
function validateFile(checkfile) {
var filter = /([^s]+(?=.(jpg|gif|png)).2)/gm;
if (filter.test(checkfile)) {
return true;
}
else {
return false;
}
}
Iemand een idee?
Gr. Jop
var extension = file['name'].replace(/^.*\./, '');
if (extension != 'txt') {
alert('Only text files are allowed (.txt).');
return false;
}
Werkt prima :-)
Dit is alleen een txt file, wat mist er in mijn code dat jquery ziet dat het een file is en deze vergelijkt?
Ik denk dat het probleem in de variabele zit, ik heb daar .val() gebruikt maar er is helemaal geen value aanwezig.
Er moet dus iets staan dat het om een file gaat, maar wat?
Ik zou eerder inzetten op een serverside oplossing.
De vraag is ook, wat probeer je uiteindelijk te bereiken? Dat er enkel afbeeldingen (van een zeker type) worden geupload? Dan zou ik daar op controleren. En niet via extensie, want dat is een slechte graadmeter.
Wanneer ik blaat.txt hernoem naar blaat.jpg dan upload elke (?) browser dat vrolijk als image/jpeg. Je zult zo'n bestand dus net wat verder aan de tand moeten voelen dan enkel de extensie. Bijvoorbeeld met getimagesize() ofzo. Als deze false retourneert weet je in ieder geval vrij zeker dat je niet met een afbeelding van doen hebt.
Dank voor de heldere reactie :)
Wat ik wil bereiken is dat jquery voordat er gepost word al een tip geeft over de extentie.
Bij de text input heb ik mijn tooltips helemaal klaar alleen met deze input "type file" wil het niet lukken.
Wat zou een oplossing kunnen zijn zodat er een true false ontstaat?
Het gaat om jpg, png, tiff en gif.
De eind controle komt later bij de submit ;)
Gr. Jop
Code (php)
1
2
3
2
3
function hasAllowedExtension(file, extensions) {
return extensions.indexOf(file.split('.').pop()) > -1;
}
return extensions.indexOf(file.split('.').pop()) > -1;
}
Aanroep:
Code (php)
1
2
3
4
5
2
3
4
5
if (hasAllowedExtension('whatever.txt', ['jpg', 'png', 'gif'])) {
// ok
} else {
// nok
}
// ok
} else {
// nok
}
Overigens vindt IE een div als submitbutton niet leuk. Beter is wellicht een button-tag met type="submit".
NB: is case sensitive, maar je kunt de lijst van extensies natuurlijk altijd uitbreiden (of ergens een "strtolower" ding tussenfrommelen).
Gewijzigd op 22/06/2016 15:32:04 door Thomas van den Heuvel