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 !

@+!

A voir également:

Input file image
Fileinput javascript - Meilleures réponses
Input file img - Meilleures réponses
Convolution image - Conseils pratiques -Java
Inverser une image photoshop - Forum Graphisme/design
Line input vba - Forum Visual Basic
Form image ✓ - Forum Visual Basic
Input et virgule ✓ - Forum Visual Basic 6

5 réponses

Réponse 1 / 5

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.

Réponse 2 / 5

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 ;-)

Réponse 3 / 5

@karamel Messages postés 1855 Date d'inscription vendredi 9 mai 2008 Statut Modérateur Dernière intervention 18 avril 2024 153
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>

Réponse 4 / 5

@karamel Messages postés 1855 Date d'inscription vendredi 9 mai 2008 Statut Modérateur Dernière intervention 18 avril 2024 153
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>

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

Posez votre question

Réponse 5 / 5

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 !

Discussions similaires

recuperation infos input type file

Créer un input type Button avec une onClick !

Line input

image avec FPDF

vectoriser un logo sous photoshop

Votre réponse

Discussions similaires