Forum : Tester la présence de fichier dans un input de type file

Réponse acceptée

if(isset($_FILES'monfichier']) AND $_FILES'monfichier']'error'] == 0)

monfichier correspond à

<input type="file" name="monfichier">

J'ai ouvert Google

Garniture-banner

Réponse acceptée

Pas sur qu'une vérification en php soit la solution, je péconise un peu de JS juste avant d'envoyer.
Avec ton bouton envoyer qui à comme name "submit" sa donne:

$("#submit").click(function(){
    var fileName = $("#file").val();
    if(fileName.length != 0)
        //On continue, l'input n'est pas vide
    else
        // Mets une claque à ton utilisateur, puis 
        // $("#file").append('<span> You must send a file </span>');
})

Pour pleins de raisons si c'est sur le bouton envoyer du formulaire que tu vérifies,faire un

e.preventDefault()

est judicieux

bingbongbam

Auteur

Réponse acceptée

Bonjour et merci beaucoup pour les réponses,
je suis ennuyer j'essaye en vain de comprendre pourquoi ce code ne fonctionne pas !
Avec la technique de Garniture-banner

$("#check").click(function(){
    var fileName = $("#file1").val();
    if(fileName.lastIndexOf("png")===fileName.length-3)
        alert("OK");
    else
        alert("Not PNG");
})

et en html

<form>
<input type="file" name="files" id="file1" style="color:White" />
<input type="submit" value="Create" />
</form>
<button value="check" id="check" name="check" >check</button>

il fonctionne sur ce site mais quand j'essaye de l'utiliser rien quand copie conforme il ne fonctionne pas en local pourtant j'ai bien si cela a un rapport jquery2.1.1,
En gros pour le tester en local ca donnerais cela

<!DOCTYPE html>
<html lang="en">
  <head>
    <?php include 'tete.php' ?>
    <script type="text/javascript">
$("#check").click(function(){
    var fileName = $("#file1").val();
    if(fileName.lastIndexOf("png")===fileName.length-3)
        alert("OK");
    else
        alert("Not PNG");
})
    </script>
    <title>Contact</title>
    <style type="text/css">
    </style>
  </head>
  <body>
    <div class="container">
      <?php include 'menu.php' ?>
        <div class="jumbotron">
                <h2>Garage</h2>
            <form>
            <input type="file" name="files" id="file1" style="color:black" />
            <input type="submit" value="Create" style="margin:10px; width:80px; height:45px;"/>
            </form>
            <button value="check" id="check" name="check" style="margin:10px; width:80px; height:45px;">check</button>
        </div>
      <?php include 'pied.php' ?>
    </div>   
  </body>
</html>

Mais ca ne fonctionne pas, avez vous une idée merci beaucoup pour le temps accordés
Crazyman

bingbongbam

Auteur

Réponse acceptée

Je suis mauvais en js ses fou...
Un regex pourquoi pas mais je veux juste filtrer sont extension.
Je n'arrive même pas à adapter le code pour qu'il accepte plusieurs condition genre png jpg jpeg gif puis qu'il charge mon fichier php.
Sa me *** ***** je déteste demander de l'aide.

Glaived

Réponse acceptée

Je n'arrive même pas à adapter le code pour qu'il accepte plusieurs condition genre png jpg jpeg gif puis qu'il charge mon fichier php.

Google is your friend ^^

Vallyan

Réponse acceptée

Comme toujours, la verification en JS c'est du luxe, c'est d'abord en PHP qu'il faut faire les checks a la reception de formulaires.

En PHP:

$allowedExtensions = array('gif','png' ,'jpg', 'jpeg'); // Liste les extensions autorisées
$extension = pathinfo($_FILES'files']'name'], PATHINFO_EXTENSION); // Récupère l'extension du fichier uploadé
if( in_array(strtolower($extension) ,$allowedExtensions) ) {
// C'est une extension autorisée, tu peux faire ton truc (note l'utilisation de strtolower si jamais c'est une extension en majuscule)
} else {
// C'est pas une extension autorisé, tu le renvoies le formulaire dans la face
}

Pour le JS, une regex, comme le dit Garniture-banner fait parfaitement l'affaire. Un truc du genre (fait très simplement, tu as sans doute d'autres verifications a faire):

$('form').submit(function(e){
    if ( $("input[name='files']").val().match(/.+\.(png|jpg|jpeg|gif)$/i) )
        return; // Autorise la soumission
    e.preventDefault(); // Empeche la soumission
})

Petit codepen pour voir comment ca marche: http://codepen.io/anon/pen/Bflkc

Glaived

Réponse acceptée

Comme toujours, la verification en JS c'est du luxe, c'est d'abord en PHP qu'il faut faire

+1, le traitement serveur est indispensable

Garniture-banner

Passe tes scripts à la fin du body meme si sa ne sert plus à rien et que c'est old-school, sa choque moins.

Essaie d'éviter le comportement par défaut du navigateur avec un preventDefault().

$("#check").click(function(e){
    e.preventDefault();
    var fileName = $("#file1").val();
    if(fileName.lastIndexOf("png")===fileName.length-3)
        alert("OK");
    else
        alert("Not PNG");
})

Une autre amélioration:
Essaie de vérifier avec une regex filename.match(/([a-zA-Z0-9_])+.(png|jpeg|jpg)/) (Affine la regex en fonction de tes besoins )

Tester la présence de fichier dans un input de type file

8 réponses