File input & infos fichier et dimensions image

bencoandco Messages postés 165 Date d'inscription samedi 8 mai 2010 Statut Membre Dernière intervention 3 janvier 2015 - 28 nov. 2012 à 09:42
bencoandco Messages postés 165 Date d'inscription samedi 8 mai 2010 Statut Membre Dernière intervention 3 janvier 2015 - 29 nov. 2012 à 10:43
Bonjour,


Je travaille sur un formulaire d'upload de fichier, d'image pour être plus précis. J'aurais voulu savoir si il est possible de récupérer le nom temporaire de l'image sélectionnée via le bouton "parcourir" afin de connaitre ses dimensions ? Ou sinon connaissez vous un moyen de récupérer les dimensions d'une image, choisie via un input file, avant qu'elle ne soit uploadée sur le serveur (côté client quoi pas en php) ?



Merci pour vos rep !


@+!

5 réponses

sylvain64520 Messages postés 130 Date d'inscription lundi 11 janvier 2010 Statut Membre Dernière intervention 7 juin 2013
28 nov. 2012 à 10:48
Tant que le fichier n'est pas uploadé sur ton serveur, je ne pense pas que tu puisses récupérer la taille de l'image. En effet, côté client, JS n'accède qu'au chemin+nom du fichier. Il n'y a que dans ton formulaire PHP que tu accède à la taille, au type...

Essaie avec Ajax.
0
bencoandco Messages postés 165 Date d'inscription samedi 8 mai 2010 Statut Membre Dernière intervention 3 janvier 2015
28 nov. 2012 à 14:47
côté client, JS n'accède qu'au chemin+nom


OK nickel du coup si je peux récup le chemin de dossier du fichier (celui de l'ordi du client) en js ça peux le faire.

je le met dans une variable chemin_fichier et je fais ça :


img = new Image();

img.src = chemin_fichier;

img.onload = function()
{
  alert(img.width+" X "+img.height);

}

 



Seul problème comment on fait pour récup le chemin de dossier ???????


Merci ;-)
0
@karamel Messages postés 1811 Date d'inscription vendredi 9 mai 2008 Statut Modérateur Dernière intervention 4 septembre 2022 145
28 nov. 2012 à 20:08
pour ie <10 tu peut recuperer le chemin en donnant un id au input et faire

document.getElementById('mon input').value


pour les autres navigateurs tu peut connaitre la taille en utilisant filereader du fichier mais ca ne fonctionnera pas avec ie < 10

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<head>
<style type="text/css">

.box{
position:absolute;
background-color:gray;
height:200px;width:250px;
margin-top:120px;
margin-left:600px;
border:1px ridge #aaa;
-moz-box-shadow: 10px 10px 10px #212121;
-webkit-box-shadow: 10px 10px 10px #212121;
box-shadow: 10px 10px 10px #616161;
}

table td{
border:2px;
border-style:solid;
}

</style>

<script type="text/javascript">

function dragenter(e) {
e.stopPropagation();
e.preventDefault();
}

function drop(e) {

if (!e) {
var fichier = document.getElementById('fileinput').files;
}
else {
var fichier = e.dataTransfer.files;
}

document.getElementById('nbfic').value=fichier.length

for(var j=0;j<fichier.length;j++){

var tbrow=document.getElementById("tabs").insertRow(-1)

tbrow.insertCell(0)
var zozo=document.createTextNode(fichier[j].size)
tbrow.cells[0].appendChild(zozo);	

tbrow.insertCell(1)
var zozo=document.createTextNode(fichier[j].name)
tbrow.cells[1].appendChild(zozo);	

tbrow.insertCell(2)
var zozo=document.createTextNode(fichier[j].type)
tbrow.cells[2].appendChild(zozo);		

}
}
</script>
</head>









nbr de fichier



taille de fichier,
nom de fichier,
type de fichier


</html>
0
@karamel Messages postés 1811 Date d'inscription vendredi 9 mai 2008 Statut Modérateur Dernière intervention 4 septembre 2022 145
28 nov. 2012 à 20:13
un autre script qui precharge une image compatible tous navigateurs a tester tout de meme avec ie 9

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<head>
<script type="text/javascript">

function chacharge(){

if(document.all) {
var filename = document.getElementById('hiddenfile').value;
var Img = new Image();
Img.src = filename;
document.getElementById('mon_image').src = Img.src; 
}
else{
var fichier = document.getElementById('hiddenfile').files;

var charge=new FileReader();
charge.readAsDataURL(fichier[0]);
charge.onload = function(e){

document.getElementById('mon_image').src = e.target.result;
}
}
}

function getfile(){
    document.getElementById('hiddenfile').click();
}


</script>
</head>













</html>
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
bencoandco Messages postés 165 Date d'inscription samedi 8 mai 2010 Statut Membre Dernière intervention 3 janvier 2015
29 nov. 2012 à 10:43
Merci pour ta réponse je vais tester tout ça et voir si ça fonctionne avec uploadify !
0