Forum Programmation.web Remplir un formulaire par le contenu d'un fichier, en local

Posté par  (site web personnel) . Licence CC By‑SA.
Étiquettes :
1
5
août
2013

Bonjour,

Contexte:

J'ai mis en place un CMS (spip) pour mes collègues. Comme la syntaxe d'édition les rebute, j'ai aussi fait un petit filtre d'export depuis openoffice vers la syntaxe utilisée par spip. Mais comme le copier-coller les rebute aussi, il faudrait qu'ils puissent uploader directement le fichier bien formaté.

Problème:

Je n'ai pas envie de me plonger dans le code source de spip, et encore moins de le modifier. J'aimerais, si c'est possible, ajouter un peu de code dans la page html contenant le formulaire d'édition, pour que l'utilisateur puisse remplir ce formulaire par sélection d'un fichier, avant d'envoyer le formulaire au serveur via le bouton habituel, comme si de rien n'était.

J'espère aussi que les collègues s'habitueront ainsi à la syntaxe du CMS, en la voyant s'afficher dans le formulaire.

Solution:

J'imagine qu'il y a un script ajax, java, ou je ne sais quoi qui sait faire ça. Mais je ne connais rien à ces langages, et mes recherches (à l'aveuglette), n'ont pas donné grand chose de bien pertinent.

Merci de votre aide.

  • # installer un module spip pour avoir un editeur wysiwyg dans spip

    Posté par  . Évalué à 2.

    comme ca tes utilisateurs saississent directement dans spip, sans connaitre le moindre code de spip.
    et en utilisant les styles predefinis par la charte graphique de ta boite.

    sinon tu peux aussi simplement faire une page web qui gere l'upload du fichier, et l'insertion directement dans la base de données.
    mais ca veut dire integrer des titres/sous titres, gras/italique/sousligné qui peuvent ne pas respecter la charte graphque

    • [^] # Re: installer un module spip pour avoir un editeur wysiwyg dans spip

      Posté par  (site web personnel) . Évalué à 3. Dernière modification le 06 août 2013 à 10:02.

      installer un module spip pour avoir un editeur wysiwyg dans spip

      Pour la dernière version de Spip, il n'y a que CKeditor de disponible, mais il est encore en développement, et c'est une vraie boucherie: il mélange le code spip avec de l'html codé en dur, il propose de modifier la couleur, la taille des polices, etc., choses que la charte graphique n'autorise pas. On peut certes préserver la typo de spip, mais cela se fait par conversion de l'html de CKeditor en code spip. Bref, tout cela me semble être de la mauvaise technologie, et instable de sucroît.

      En outre, et c'est l'argument principal, les utilisateurs produisent leurs textes avec des traitements de textes, et peuvent, dans certains cas, les publier sur deux sites. J'ai donc fait deux filtres d'export openoffice, un pour chaque site. Ça me semble être la meilleur solution, si ce n'est que j'aurais aimé automatiser le copier coller.

      Sinon tu peux aussi simplement faire une page web qui gere l'upload du fichier, et l'insertion directement dans la base de données.

      Ou modifier le formulaire de spip pour qu'il prenne un fichier en entrée et pas une boite de texte. C'est ce que je ferai s'il n'est pas possible de remplir un formulaire par un fichier en local ; mais je suis certain que c'est possible, et même basique avec les nouvelles technologies du web.

      • [^] # Re: installer un module spip pour avoir un editeur wysiwyg dans spip

        Posté par  . Évalué à 2.

        mais je suis certain que c'est possible, et même basique avec les nouvelles technologies du web.

        pour l'avoir testé sur certains sites d'offres d'emploi, c'est loin d'etre au point, selon que le fichier (souvent word ou pdf) contient des tableaux, des images, etc,
        je me suis retrouvé avec mon CV tout mélangé entre les dates, les lieux et les employeurs.

        par contre si tu veux developper toi meme, sache qu'un fichier openoffice, c'est une archive zip avec des sous dossiers.
        dans un de ces dossiers, tu as le code XML de la page,
        il te suffit alors juste de lire ce code, et de le convertir en code SPIP

        ce que tu auras codé, tu le met derriere un formulaire à ta sauce
        et tu injectes l'article dans la base de donnée,
        ainsi tu ne touches pas au code SPIP, facilitant les mises à jour futures.

        • [^] # Re: installer un module spip pour avoir un editeur wysiwyg dans spip

          Posté par  (site web personnel) . Évalué à 2. Dernière modification le 06 août 2013 à 17:21.

          par contre si tu veux developper toi meme, sache qu'un fichier openoffice, c'est une archive zip avec des sous dossiers. dans un de ces dossiers, tu as le code XML de la page,
          il te suffit alors juste de lire ce code, et de le convertir en code SPIP.

          Je sais, merci. Les filtres xslt sont prêts, et mon [libre|open]office propose dorénavant l'export vers le format spip, ainsi que vers celui de l'autre site.

          pour l'avoir testé sur certains sites d'offres d'emploi, c'est loin d'etre au point, selon que le fichier (souvent word ou pdf) contient des tableaux, des images, etc, je me suis retrouvé avec mon CV tout mélangé entre les dates, les lieux et les employeurs.

          Chez moi ça marche™. Il suffit maintenant remplir le formulaire avec le fichier ad hoc bien formaté. Tu m'assures toi-même que c'est possible. Sur quel site? Avec quelle technologie? T'as pas un bout de code sous la main?

          ce que tu auras codé, tu le met derriere un formulaire à ta sauce et tu injectes l'article dans la base de donnée, ainsi tu ne touches pas au code SPIP, facilitant les mises à jour futures.

          C'est tout ce que je veux éviter: apprendre la structure de la base de donnée de spip, me ressouvenir des bases de programmation web+sql que je connais, faire gaffe à la sécurité, gérer les limites du serveur, expliquer aux utilisateurs qu'il y a deux formulaires…

          Au pire, comme dit ci-dessus, j'ajouterai au formulaire de spip un bouton pour uploader le fichier plutôt que d'utiliser la boite texte. Mais je préfèrerais remplir la boite texte proposée par spip avec le contenu du fichier. C'est plus simple pour moi, plus transparent pour spip, et plus pédagogique pour les utilisateurs.

          J'explique à nouveau ma question, puisque manifestement, je n'ai pas été clair:

          • machin écrit son CV dans openoffice.
          • Il l'exporte depuis openoffice dans CV.spip.
          • Il ouvre son site à la page de son futur CV, et ouvre la boite d'édition: un beau formulaire vide lui est proposé par spip.
          • Il clique sur le bouton créé par mes soins "utiliser un fichier.spip", choisit le fichier CV.spip, et le formulaire vide est maintenant rempli par le contenu de CV.spip.
          • Il enregistre par le bouton habituel proposé par spip, et ce n'est qu'à ce moment là que son CV est uploadé.

          Bref, la question est bien: comment remplir un formulaire par le contenu d'un fichier, en local?

          • [^] # Re: installer un module spip pour avoir un editeur wysiwyg dans spip

            Posté par  . Évalué à 3.

            je fais ce que je peux pour t'aider mais

            tu ne veux pas coder dans spip :

            Je n'ai pas envie de me plonger dans le code source de spip, et encore moins de le modifier.

            mais tu veux bien quand meme

            J'aimerais […] ajouter un peu de code dans la page html contenant le formulaire d'édition, pour que l'utilisateur puisse remplir ce formulaire par sélection d'un fichier, avant d'envoyer le formulaire au serveur via le bouton habituel, comme si de rien n'était.

            mais tu ne veux pas faire de formulaire web/upload/script à part de ton spip

            C'est tout ce que je veux éviter: apprendre la structure de la base de donnée de spip, me ressouvenir des bases de programmation web+sql que je connais, faire gaffe à la sécurité, gérer les limites du serveur, expliquer aux utilisateurs qu'il y a deux formulaires…

            bref, tu ne veux pas modifier le code de ton spip, mais tu veux bien quand meme modifier le formulaire de ton spip pour ajouter un bouton qui ferait un traitement d'un fichier uploadé ?

            donc de ce que je comprend des sites ou j'ai pu faire un upload d'un fichier word vers un formulaire,
            en fait ca fait l'upload, ca decripte le fichier, ca injecte dans la base de donnée,
            et ca reaffiche le formulaire prerempli avec les infos de la base de données.

            si tu ne veux pas t'embeter avec la base de donnée, tu dois pouvoir le gerer à coup de javascript pour reecrire le contenu des cases du formulaire,
            mais là encore, cela va t'obliger à coder pour modifier ton SPIP du coté des formulaires de SPIP

            il ne te reste plus que les plugins, développés par d'autres, mais plus simple à intégrer.
            et qui t'eviteront de coder

            • [^] # Re: installer un module spip pour avoir un editeur wysiwyg dans spip

              Posté par  (site web personnel) . Évalué à 2. Dernière modification le 06 août 2013 à 22:09.

              je fais ce que je peux pour t'aider

              Je te remercie de m'aider :) Je croyais tellement que ma question avait une réponse simple, du genre b à ba de la programmation javascript, que je ne comprenais pas pourquoi tu venais me proposer autre chose /0\

              bref, tu ne veux pas modifier le code de ton spip, mais tu veux bien quand meme modifier le formulaire de ton spip pour ajouter un bouton qui ferait un traitement d'un fichier uploadé ?

              Ah, j'aurais du préciser cela: dans spip, les pages html sont construites à partir de templates, qu'il est aisé de modifier. C'est ce que je veux faire: modifier le template de la page contenant le formulaire pour y ajouter le code javascript qui conviendrait.

              si tu ne veux pas t'embeter avec la base de donnée, tu dois pouvoir le gerer à coup de javascript pour reecrire le contenu des cases du formulaire, mais là encore, cela va t'obliger à coder pour modifier ton SPIP du coté des formulaires de SPIP.

              Oui :) c'est ce que je veux faire, et avec un peu de chances, je n'ai pas besoin de toucher au code php, mais seulement aux templates (j'ai pas vérifié, mais je ne m'inquiète pas trop sur ce point).

              il ne te reste plus que les plugins, développés par d'autres, mais plus simple à intégrer. et qui t'eviteront de coder

              J'ai fait le tour des plugins. Il y a d'ailleurs un plugin odt2spip, que je pensais utiliser. Mais il est buggé, et ne s'applique qu'aux nouvelles pages, pas celles qui doivent être modifiées. Bref, il ne fait pas le boulot dont j'ai besoin. Je pensais partir sur cette base, le débugger et l'adapter à mes besoins. Mais en regardant les entrailles du plugin, je me suis dit qu'il serait plus simple 1) d'utiliser la suite office pour l'export vers le format de spip, 2) d'ajouter quelques lignes de script dans les templates pour remplir le formulaire de spip avec le fichier ainsi produit.

              Cette façon de faire me permet en outre d'éviter de faire du php (que j'ai déjà essayé il y a bien cinq ans, mais que je n'ai pas apprécié, et que j'ai oublié), pour découvrir (simple curiosité) un peu les « nouvelles » technologies du web.

              Mes recherches à l'aveuglette avancent peu à peu: populating a form from json file, fait grosso modo ce dont j'ai besoin, sinon que j'aimerais que l'utilisateur choisisse le fichier avec lequel remplir le formulaire (ce que je devrais pouvoir trouver par ailleurs).

  • # Javascript FileReader() et readAsText()

    Posté par  (site web personnel) . Évalué à 6.

    Youhou ! J'ai trouvé !

    Javascript sait faire ça, sur les navigateurs à la pointe, en utilisant la fonctions FileReader.

    Voici le code qui va bien:

    <html>

<head>
    <script type="text/javascript">
    oFReader = new FileReader(); 

    oFReader.onload = function (oFREvent) {
        document.getElementById('info').value =  oFREvent.target.result;
    };

    function GetFileInfo() {
        if (document.getElementById("fileInput").files.length === 0) { return; }
        var oFile = document.getElementById("fileInput").files[0];
        oFReader.readAsText(oFile);
    }

    </script>
</head>

<body>
    <form name="test">
    <textarea type="text" id="info" cols="80" rows="20"></textarea>
    </form>
    <input id="fileInput" type="file" size="50" onchange="GetFileInfo ()" />
</body>

</html>

Suivre le flux des commentaires

Note : les commentaires appartiennent à celles et ceux qui les ont postés. Nous n’en sommes pas responsables.