[Javascript] - Addeventlistener

[indys]

Bonjour/Bonsoir à tous !

Je débute tout juste dans le javascript, et pour éviter de blablater, je vous montre directement ce que je souhaite faire sur un input type=file via ce lien :

https://codepen.io/GeoffreyCrofte/pen/HbwcG

J'ai beau avoir essayer toutes les manipulations possible pour le faire fonctionner sur mon site .. impossible …

Je pense qu'il s'agit du javascript et plus particulièrement le "addeventlistener" ( je me trompe peut-être) qui pose soucis ( sachant que j'ai un menu fixe basé sur du JS qui

fonctionne parfaitement … je m'arrache les cheveux depuis ce matin).

Est-ce l'abonnement Planet Hoster Worldlite qui limite ceci?

Je ne sais pas si une âme charitable peu m'aider à déterminer d'où viens le problème …

Merci d'avance

 

[marckisscool]

Bonjour,

Une question bête vous l'avez essayé sous sa forme basique sans l'intégrer?
Concernant le javascript il n'y a pas de limitation côté hébergement world, le script actuellement ne fait que récupérer le path et le nom de fichier qu'il affiche sous le bouton, c'est l'effet attendu?

 

[indys]

Bonjour,

Oui c'est l'effet attendu En revanche, je suis désolée, je ne vois pas comment procéder "sous sa forme basique".
Je suis vraiment débutante ( j'ai commencer hier le javascript ^^' ) J'ai regarder pas mal de forum, de tuto mais en vain
Auriez-vous la possibilité de me fournir un exemple s'il vous plait ? Histoire de me mettre sur la piste :/

Merci en tout cas pour votre retour

 

[indys]

Je viens de tilter "sous sa forme basique" : sans intégrer le JS ? si c'est cela oui ca fonctionne normalement puisque c'est le code standard input type=file. ( Si c'est bien cela que vous vouliez parler ^^')

 

[marckisscool]

Bonjour,

Alors j'ai trouvé un excellent tuto qui explique exactement ce que vous désirez faire: https://maximeblanc.fr/blog/uploader-un-fichier-en-javascript-avec-fetch
Si sous la forme basique (donc une page brute avec le js qui ne fait que ça) cela fonctionne bien, c'est l'intégration dans votre code qui pose problème (un conflit ou une incompatibilité), malheureusement il faudrait avoir les sources pour faire une analyse plus poussée de ce qui ne fonctionne pas.
Il est difficile de savoir ce qui rentre en conflit dans du javascript sans avoir la totalité du script, ou au moins faire un prototype basique de l'ensemble des scripts javascript que vous souhaitez faire cohabiter.

 

[indys]

Je vais tester ca dans la journée et je vous tiens au courant.

En revanche, non cela ne fonctionne pas du coup, j'avais créer une page totalement vierge avec seulement le js et le html, cela ne fonctionne pas du tout ... que se soit en adaptant avec mon site ou bien en faisant du copier/coller (qui lui fonctionne très bien sur codepen).

 

[marckisscool]

Bonjour,

En faite le code que vous avez donné n'est qu'une partie de code, destiné au client. Il faut bien comprendre que le javascript ne s'exécute que côté client, il lui est donc impossible d'écrire sur le serveur quoique ce soit (d'ou le lien que je vous ai communiqué).
Pour écrire sur le serveur il faut le faire soit au travers d'une api avec un langage adapté soit au travers d'un script php.
Dans l'exemple que je donne (sur lequel on peut implémenter votre solution js) il y a la partie client (c'est le javascript) et la partie serveur avec le fichier upload.php .
Pour simplifier le js envoi sa donnée au fichier php, et c'est lui qui va écrire le fichier sur le serveur.
J'ai testé le script de maxime, et cela fait le job.