Bonjour ! Dans mon projet Symfony, j'ai une page de profil où j'affiche notamment l'avatar de l'user, ainsi qu'un autre fichier qu'il peut modifier à sa guise.

Pour ça j'utilise VichUploaderBundle.

Lorsque mon user va checker son profil, je veux faire en sorte que si il possède un avatar, ou un fichier, les noms de ceux-ci se retrouvent dans le champs associé :

Dans cet exemple, mon user a déjà upload son fichier (puisqu'il y a marqué "Télécharger" juste en dessous, chose que je vais changer d'ailleurs ).

Donc puisqu'il a déjà un fichier, je veux que le champs contienne par défaut le nom du fichier.

Donc, ça, j'ai réussi à le faire en javascript :

    <script>
        var feuilleConge = document.querySelector('[for = "profile_feuilleConge_feuilleCongeFile_file"]');

        if ('{{ user.feuilleConge }}' != null) {

            name = '{{ user.feuilleConge.feuilleCongeName }}';
            feuilleConge.innerHTML = '{{ user.feuilleConge.feuilleCongeName }}';

        }
    </script>

En gros je prends le sélecteur correspondant au champs File.

Ensuite je prends le nom du fichier que l'utilisateur a jadis upload, et je l'injecte dans le champs, si il existe.

Mais il y a un truc qui va pas.

Dans ma condition, je test si l'user a un fichier, enfin je sais pas si ça marche comme ça en javascript en twig pour accéder aux champs de ce type... Donc quand l'utilisateur a un fichier, ça marche. Mais quand il n'en a pas, ma condition if ne fonctionne pas et j'ai l'erreur

Impossible to access an attribute ("feuilleCongeName") on a null variable.

Quelqu'un pourrait m'aiguiller svp ?

bonjour,

utiliser jquery serais plus simple

par contre pour répondre ajouter des données twig dans le javascript oui c'est tout à fait faisable

ah tu donné accès aus données user dans ton controller?

-
Edité par AaFredericHusson 16 septembre 2019 à 17:18:32

Salut,

tu as mélangé des données issues de Twig et de Javascript, c'est pour ça que ça coince.

Il faut que tu fasses la vérification sur user.feuilleConge avec Twig. Si c'est ok, tu demandes à Twig d'afficher le script, et si non,  tu n'affiches pas le script.

<script>
    var feuilleConge = document.querySelector('[for = "profile_feuilleConge_feuilleCongeFile_file"]');
 
    {% if user.feuilleConge %}
 
        name = '{{ user.feuilleConge.feuilleCongeName }}';
        feuilleConge.innerHTML = '{{ user.feuilleConge.feuilleCongeName }}';
 
    {% endif %}
</script>

e.

je comprend pas tout, c'est quoi le but d'utiliser javascript pour faire une vérivication php?

-
Edité par AaFredericHusson 16 septembre 2019 à 17:51:42

C'est pas pour faire une vérification PHP, c'est pour afficher le nom du fichier uploadé dans le champ "Feuille de congés".

https://getbootstrap.com/docs/4.0/components/forms/#file-browser

https://stackoverflow.com/questions/43250263/bootstrap-4-file-input

le problème si tu fais ça, c'est que si tu soumets ton formulaire, il va essayer de télécharger à nouveau le fichier.

Je partirai plutôt sur un affichage dynamique: s'il n'y a pas de fichier, tu affiches le champ du formulaire. Et s'il y a un fichier, tu affiches le nom du fichier (avec la possibilité d'afficher le champ du form pour changer ce fichier)

si on reprend ce coe il y a un mélange de php et javascript

<script>
    var feuilleConge = document.querySelector('[for = "profile_feuilleConge_feuilleCongeFile_file"]');
  
    {% if user.feuilleConge %}
  
        name = '{{ user.feuilleConge.feuilleCongeName }}';
        feuilleConge.innerHTML = '{{ user.feuilleConge.feuilleCongeName }}';
  
    {% endif %}
</script>

Merci à tous pour vos réponses !

Alors effectivement, j'oubliais que vu que j'étais dans un fichier twig je pouvais utiliser la syntaxe Twig ! J'étais focus sur "Je suis dans le block Javascript alors je dois utiliser que du javascript".

Bah maintenant ça marche niquel !

Ralchimist a écrit:

le problème si tu fais ça, c'est que si tu soumets ton formulaire, il va essayer de télécharger à nouveau le fichier.

Alors non puisque je ne fais que modifier le contenu du champs. J'aurais pu marquer 'coucou' à la place du nom du fichier, si je soumets, tout est OK.

Et j'avais vraiment besoin d'afficher le champs en toute circonstance

AaFredericHusson a écrit:

je comprend pas tout, c'est quoi le but d'utiliser javascript pour faire une vérivication php?

Alors pour répondre à ta question ( si j'ai bien compris ), moi j'utilise VichUploader pour gérer l'upload de mes fichiers et images sur l'application. Le problème c'est qu'avec Bootstrap 4, si je sélectionne un fichier, eh bien le champs va bien comprendre que j'ai sélectionné un fichier, mais il ne va pas afficher le nom du fichier que j'ai sélectionné.

Du coup pour contrer ça, j'utilise un script tout sympa qui redonne la bonne fonctionnalité :

<script src="https://cdn.jsdelivr.net/npm/bs-custom-file-input/dist/bs-custom-file-input.min.js"></script>

    <script>
        $(document).ready(function () {
            bsCustomFileInput.init();

        });
    </script>

Et quand j'arrive sur la page de profil, le but est de permettre à l'utilisateur de modifier ce fichier, donc c'est mieux si il voit déjà quel fichier il a déjà upload, d'où le fait que je veuille afficher dans le champs le nom du fichier si il y en a un

AaFredericHusson a écrit:

si on reprend ce coe il y a un mélange de php et javascript

<script>
    var feuilleConge = document.querySelector('[for = "profile_feuilleConge_feuilleCongeFile_file"]');
  
    {% if user.feuilleConge %}
  
        name = '{{ user.feuilleConge.feuilleCongeName }}';
        feuilleConge.innerHTML = '{{ user.feuilleConge.feuilleCongeName }}';
  
    {% endif %}
</script>

Alors c'est pas du PHP mais une syntaxe Twig Et donc chose que je ne savais pas, on peut l'utiliser dans le block Javascript !

Voilà en tout cas merci vous m'avez bien aidé !

-
Edité par AgarioFR 16 septembre 2019 à 21:48:00

Alors c'est pas du PHP mais une syntaxe Twig  Et donc chose que je ne savais pas, on peut l'utiliser dans le block Javascript !

oui mais j'ai quand même juste sur le fait que c'est tout de même même du php mais qui est interprété par twig enfin je sais pas si j'ai été clair lol

si on reprend cette ligne

{% if user.feuilleConge %}

c'est bien un if qui es du php à la base

-
Edité par AaFredericHusson 16 septembre 2019 à 22:10:02

Bah écoute le principal, c'est que ça marche  Ca a pas l'air de causer de problèmes quand je lance ça, aucune erreur, rien, donc c'est que ça doit être valide. A partir de là.. 

je dit pas que ça fonctionne pas

je te dit juste que c'est du php

car la commande twig suivant:

{% if user.feuilleConge %}

équivaut à écrire

<?php
if (ma condition) {
// ici on fait ce qu'il faut
}