Discussion :

[barale61]

Bonjour,

Je souhaite masquer ma div qui affiche la miniature de mon image si aucune image n'est sélectionnée et l'afficher lorsqu'il y en a une. En php je ferais:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
if(isset($_FILES['fichier']) && $_FILES['fichier']['error'] == 0){

donc là, j'afficherais ma div mais comment faire en javascript. Sans doute quelque chose comme:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
document.getElementById('madiv').style.display ="none";

si pas d'image mais, comment savoir si aucune image est sélectionnée?

Je vous remercie de votre aide.

[barale61]

j'essai en js de cette façon, mais il me dit que fichier n'est pas défini (ReferenceError: getElementById is not defined à cette ligne: if (getElementById('fichier').value != null) {)
Alors que l'id fichier est bien là.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
 
<script>
            if (getElementById('fichier').value != null) {
                document.getElementById('image_preview').style.display = "block";
                document.getElementById('image_preview').style.zIndex = "10";
            } 
</script>

[MehrezLabidi]

du coté html, tu es sur que tu as un input avec

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<input class='file' type="file" id="fichier"  ..

?!
il faut penser au cas de reset qui va être compliquée.
je crois que avec jquery (onchange ..) ca peut être plus simple

[barale61]

Voici mon html:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
 
     <!--DEBUT POUR AJOUTER UNE PHOTO-->
      <div class="row">
        <div id="ajout_photo" class="file-field input-field col s12 m12 l12">
               <span>Photo</span>
                    <center>
                        <span class="valign">
                            <i class="medium i_photo material-icons waves-effect waves-light">add_a_photo
                            <input type="file" name="fichier" id="fichier">
                            </i>
                        </span>
                    </center>
        </div> 
      </div> 
    <!--FIN POUR AJOUTER UNE PHOTO-->

[barale61]

J'ai utilisé jquery:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
 
                $(document).ready(function(){
                $("input").change(function(){
                document.getElementById('image_preview').style.display = "block";
                document.getElementById('image_preview').style.zIndex = "10";
                });
            });