[Résolu]GetElementById = undefined

Bonjour à tous,

je suis en train de faire un module d'upload de fichier sur mon site.

Mon formulaire d'envoi de se trouve dans une fenêtre modale et du coup il m'est impossible de récupérer la valeur de mon input file, mais lorsque j'accède directement à la jsp sans l'inclure dans une fenêtre modale cela fonctionne bien.

J'ai deux formulaire d'envoi de fichiers sur la page :

<div id="addFile" style="display: none;">
     
    <jsp:include page="uploadFile.jsp"></jsp:include>
</div>
 
 <div id="addPj" style="display: none;">
     
    <jsp:include page="uploadPj.jsp"></jsp:include>
</div>

Mes formulaires d'envois :

<div class="upload_form_cont">
                <form id="upload_form" enctype="multipart/form-data" method="post" action="uploadServlet">
                    <div>
                        <div><label for="image_file">Sélectionner un fichier</label></div>
                        <input type="hidden" name="userId" id="userId" value="<%=userId%>"/>
                        <input type="hidden" name="docUp" id="docUp" value="1"/>
                        <div><input type="file" name="file" id="file" onchange="fileSelected();" /></div>
                    </div>
                    <div>
                        <input type="button" value="Envoyer" onclick="startUploading()" />
                    </div>
                    <div id="fileinfo">
                        <div id="filename"></div>
                        <div id="filesize"></div>
                        <div id="filetype"></div>
                        <div id="filedim"></div>
                    </div>
 
                    <div id="error2">Une erreur s'est produite. Contactez le service info</div>
                    <div id="abort">Le chargement a été annulé ou la connexion avec le serveur a été interrompue</div>
                    <div id="warnsize">Fichier trop volumineux (> à 30 Mo)</div>
 
                    <div id="progress_info">
                        <div id="progress"></div>
                        <div id="progress_percent">&nbsp;</div>
                        <div class="clear_both"></div>
                        <div>
                            <div id="speed">&nbsp;</div>
                            <div id="remaining">&nbsp;</div>
                            <div id="b_transfered">&nbsp;</div>
                            <div class="clear_both"></div>
                        </div>
<!--                         <div id="upload_response"></div> -->
                    </div>
                </form>
 
                <img id="preview" />
            </div

Et la partie du script qui ne fonctionne pas :

var upFile = document.getElementById('file').files[0];

J'ai pensé à un problème de conflit entre fichier .js mais après test ce n'est pas ça.

Le seul problème que je vois pour le moment c'est que mon formulaire est placé dans une fenêtre modale et que je ne sais pour quelle raison les valeurs du formulaires sont vides.

Merci d'avance pour votre aide .
Modifié par killaz133 (05 Sep 2014 - 08:42)

Salut merci de ta réponse , mais le files[0] sert juste à récupérer le premier fichier de l'input type file , car il n'y pas de choix multiple de fichier.
Mais j'ai pu résoudre mon problème , cela venait bien du script de ma fenêtre modale qui devait faire un conflit, j'ai donc écrit un autre code et ça fonctionne.