Manipulation et fonctions pour les champs fichiers des formulaires (type=file)
Soyez le premier à donner votre avis sur cette source.
Snippet vu 16 882 fois - Téléchargée 28 fois
Contenu du snippet
Ce tutoriel vous explique comment manipuler les champs fichiers des formulaires html, en sachant que ceux-ci sont par raison de sécurité bloqués, il est difficile de les réinitilaiser par exemple.
Voilà quelques astuces pour eviter les saisies érronées dans ces champs, et guider au plus l'utilisateur.
Dans tous mes exemples de fonctions je considére que vous avez fait dans la page un formulaire contenant un champ file de nom et identifiant file, entre des balises label d'identifiant InputFile (le label est important !)
Exemple de code html :
<form>
<label id="InputFile">
<input type="file" name="file" id="file" onChange="CheckFormat();">
</label>
<form>
J'ai pas fait de tableaux dans les entrées de mes scripts tout simplement car pour le gérer en php c'est plus simple de gérer une chaine à splitter.
Désolé si je n'explique pas plus mes fonctions mais le code est assez simple à comprendre.
Bonne prog à tous et j'éspére que ça aidera.
Voilà quelques astuces pour eviter les saisies érronées dans ces champs, et guider au plus l'utilisateur.
Dans tous mes exemples de fonctions je considére que vous avez fait dans la page un formulaire contenant un champ file de nom et identifiant file, entre des balises label d'identifiant InputFile (le label est important !)
Exemple de code html :
<form>
<label id="InputFile">
<input type="file" name="file" id="file" onChange="CheckFormat();">
</label>
<form>
Source / Exemple :
// Tout d'abord insérer le code de dreamweaver dans la page, car j'utilise ses fonctions
<script language="JavaScript" type="text/JavaScript">
<!--
function MM_reloadPage(init) { //reloads the window if Nav4 resized
if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
</script>
// ----- Fonction permettant de remettre à 0 le contenu du FILE -----
function RAZ_File() {
var champ = MM_findObj("InputFile");
champ.innerHTML = '<input type="file" name="file" id="file" onChange="CheckFormat();">';
}
// ---- Fonction permettant de retrouver le nom du fichier ------
function GetFileName() {
var file = MM_findObj("file");
var str = new String(file.value);
var ar = str.split("\\");
return ar[ar.length - 1];
}
// Fonction permettant de savoir si l'extension du fichier est correcte
function CheckFormat() {
var format = '.jpeg|.gif|.jpg';
var file = MM_findObj("file");
var args = format.split("|");
var ok = false;
var arg_list = new String;
for (i = 0; i < args.length; i++) {
var valeur = args[i];
var nom_fic = file.value.substr(file.value.length - valeur.length, valeur.length).toLowerCase();
arg_list += "*"+valeur+" ";
if (valeur == nom_fic) {
ok = true;
return ok;
}
}
if (!ok) {
alert("Le format de votre fichier n'est pas correct !\nLes formats acceptés sont : \n"+arg_list+"\n\nVeuillez selectionner un autre fichier.");
RAZ_File();
}
return ok;
}
Conclusion :
J'ai pas fait de tableaux dans les entrées de mes scripts tout simplement car pour le gérer en php c'est plus simple de gérer une chaine à splitter.
Désolé si je n'explique pas plus mes fonctions mais le code est assez simple à comprendre.
Bonne prog à tous et j'éspére que ça aidera.
A voir également
- Manipulation de fonction
- Javascript .document - Meilleures réponses
- Manipulations de fonctions - Meilleures réponses
- Fonction de recherche de fichiers. c tout simple mais utile - Codes sources - Visual Basic / VB.NET (Fichier / Disque)
- Fonction bcopy() pour copier n'importe quel type de fichier sur tous les fournisseurs d'accés (free, - Codes sources - PHP (Réseau & Internet)
- Quelques fonctions sur supports,répertoires,fichiers. - Codes sources - Javascript (Divers)
- Foxpro : Fonctions utiles sur les fichiers et dossiers avec windows scripting host - CodeS SourceS - Guide
- Apprendre à manipuler excel (graphique et tableau) les fichiers textes (lecture) - Codes sources - Visual Basic / VB.NET (VBA)
var thisext = fieldvalue.substr(fieldvalue.lastIndexOf('.'));
for(var i = 0; i < t_ext.length; i++){
if(thisext.toUpperCase() == t_ext[i].toUpperCase()){
return true;
}
}
return false;
}
appel
if(!checkExtension(document.forms[0].image.value, ['jpg','jpeg','gif','png'])) {
alert("Ce n'est pas une image");
}
Aucun alignement, commentaires inexistant... on n'a qu'a regarder cette fonction pour s'appercevoir que ce code est dégeu...
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
Désolé, mais du code qui fonctionne n'est pas nécessairement du bon code... faut penser à la lisibilitée du code aussi, sinon il devient impossible à réutiliser...
Vous n'êtes pas encore membre ?
inscrivez-vous, c'est gratuit et ça prend moins d'une minute !
Les membres obtiennent plus de réponses que les utilisateurs anonymes.
Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.
Le fait d'être membre vous permet d'avoir des options supplémentaires.