Masquer un élément si pas de photo dans un input

Résolu
barale61 Messages postés 1214 Date d'inscription   Statut Membre Dernière intervention   -  
barale61 Messages postés 1214 Date d'inscription   Statut Membre Dernière intervention   -
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: 
if(isset($_FILES['fichier']) && $_FILES['fichier']['error'] == 0){

donc là, j'afficherais ma div mais comment faire en javascript. Sans doute quelque chose comme: 
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.
A voir également:

2 réponses

Réponse 1 / 2
Grandasse_ Messages postés 924 Date d'inscription   Statut Membre Dernière intervention   597
 
Bonjour,
C'est un peu curieux. On peut voir un peu plus de ton code ?
0
Réponse 2 / 2
barale61 Messages postés 1214 Date d'inscription   Statut Membre Dernière intervention   110
 
Voici mon html 

<!--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-->
    <!-- DEBUT APERCU DE LA MINIATURE --> 
      <div class="row">
            <div id="image_preview" class="col s12 m6 l8">
                <div class="thumbnail hidden"> <!--Pour la class thumbnail dans ajoutClient.func.js et hidden -->
                    <img src="" alt="" class="taille_miniature">
                    <p class="nom_photo"></p>
                    <p class="poids"></p>
                    <button class="btn btn-block blue" type="button">Annuler cette photo</button>
                </div>
            </div>
      </div>
      <!-- FIN APERCU DE LA MINIATURE -->


Et je souhaiterais que la div "image_preview" n'apparaisse pas si il n'y a aucun fichier sélectionné.
0
Grandasse_ Messages postés 924 Date d'inscription   Statut Membre Dernière intervention   597
 
Du coup je verrai un truc du genre (modif ligne 20): 
<!--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-->
    <!-- DEBUT APERCU DE LA MINIATURE --> 
      <div class="row">
if (isset($_files['fichier']) {
            <div id="image_preview" class="col s12 m6 l8">
                <div class="thumbnail hidden"> <!--Pour la class thumbnail dans ajoutClient.func.js et hidden -->
                    <img src="" alt="" class="taille_miniature">
                    <p class="nom_photo"></p>
                    <p class="poids"></p>
                    <button class="btn btn-block blue" type="button">Annuler cette photo</button>
                </div>
            </div>
}
      </div>
      <!-- FIN APERCU DE LA MINIATURE -->


Si je puis me permettre une petite remarque, la balise <center> est obsolète et dépréciée.
0
barale61 Messages postés 1214 Date d'inscription   Statut Membre Dernière intervention   110 > Grandasse_ Messages postés 924 Date d'inscription   Statut Membre Dernière intervention  
 
De cette façon, cela ne marche pas mais je pense qu'il faudrait réactualiser la page en js alors 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à. 

        
<script>
            if (getElementById('fichier').value != null) {
                document.getElementById('image_preview').style.display = "block";
                document.getElementById('image_preview').style.zIndex = "10";
            } 
</script>
0
barale61 Messages postés 1214 Date d'inscription   Statut Membre Dernière intervention   110
 
J'ai utilisé jquery: 

            
               $(document).ready(function(){
                $("input").change(function(){
                document.getElementById('image_preview').style.display = "block";
                document.getElementById('image_preview').style.zIndex = "10";
                });
            });
0

Discussions similaires

input signal out of range
marlene -
usman000 -

14 réponses
comment désactiver out of range
lzri98 -
jeannets -

3 réponses
ne pas voir la story de quelqu'un mais sans la bloquer
Escargot20 -
lofoso -

1 réponse
aidez-moi à m'amuser sur mon P.C!
Manola -
Screuscreu -

2 réponses
Démasquer la story bloqué
xxmarrymexx -
dia -

5 réponses