Je suis en train de réaliser un formulaire en php, jusque la rien de bien compliqué.
J'ai inséré un champ de type "file" qui permet d'uploader un fichier.
Or je souhaiterais qu'avec du jquery, l'extension du fichier dans le champs du formulaire soit validé lorsque l'internaute soumet le formulaire.
En gros, je souhaiterais que la vérification se fasse avant l'action du formulaire. Si cette vérification n'est pas validée, alors on arrête le script (et donc le formulaire n'est pas envoyé).
Voici mon code php :
Code : Tout sélectionner
<form name="ajout" id="ajout" method="post" action="" enctype="multipart/form-data">
<fieldset>
<p id="item_formulaire">Image <span class="oblig">*</span></p>
<p id="champ_formulaire"><input id="image" name="image" type="file" /><span class="error"></span><input type="hidden" name="MAX_FILE_SIZE" value="12345" /></p>
</fieldset>
<fieldset>
<p id="item_formulaire"><input type="submit" name="valider" value="Ajouter l\'actualité" /></p>
</fieldset><br />
<p class=\"oblig\">* Champs obligatoires</p>
</form>'
J'ai ensuite crée ce script en Jquery :
Code : Tout sélectionner
// JavaScript Document
$(function() {
$("#ajout").submit(function() {
valid=true;
if($("#image").val()=="") {
$("#image").next(".error").fadeIn(1000).text("Email requis");
$("#image").css("border-color","#f55");
$("#image").css("background-color","#fcc");
valid=false;
}
else if(!$("#email").val().match(/@"(.*?)\.(jpg|jpeg|png|gif)$"/)){
$("#image").next(".error").fadeIn(1000).text("Extension invalide");
$("#image").css("border-color","#f55");
$("#image").css("background-color","#fcc");
valid=false;
}
else {
$("#image").next(".error").slideUp();
$("#image").css("border-color","#eee");
$("#image").css("background-color","#fff");
}
return valid;
});
}
);
Quelqu'un a une idée ?
Merci d'avance
