Formulaire HTML sans site internet

Version imprimable

Voir 40 message(s) de cette discussion en une page

09/10/2016, 21h27
Ruyneau

Formulaire HTML sans site internet

Bonjour,
je ne sais pas trop où poser la question... donc peut être que je me trompe d'endroit.
Jusqu'à présent, je créais des formulaires en pdf modifiable (ou éditable) que j'envoyais aux correspondants.
Or certains utilisateurs rencontrent des problèmes de saisie ou sauvegarde ou autres (çà se passe bien pour 90% des usagers) à cause des multiples logiciels de lecture du format pdf.

Je souhaiterais modifier le format d'envoi et j''ai regardé les formulaires au format HTML.
J'arrive à les créer, à les envoyer par mail mais je n'arrive pas à récupérer les données saisies.
De plus, j'ai fait des frame et lorsque je change de page, tout ce qui était contenu dans une page est automatiquement effacé.

Ma question est la suivante : peut-on gérer des formulaires HTML uniquement par mail et sans passer par la création d'un site web? Comment fait-on pour conserver ce qui a été saisie (sans passer par un site web)?

Merci pour vos réponses.
Gabriel
10/10/2016, 09h33
eleydet

Bonjour,

Citation:

Peut-on gérer des formulaires HTML uniquement par mail et sans passer par la création d'un site web?

On peut envoyer par mél un fichier au format HTML que le destinataire devra ouvrir avec un navigateur. Parfois, les codes HTML sont directement interprétés par le client mél, mais cela dépend du client utilisé.

Citation:

Comment fait-on pour conserver ce qui a été saisie (sans passer par un site web)?

Le JavaScript n'est pas conçu pour générer un fichier enregistré sur le disque dur du client. Les possibilités sont donc plutôt limitées. Des bibliothèques permettent de générer un fichier au format PDF, que l'utilisateur pourra choisir d'enregistrer ou pas.
Exemple : http://pdfmake.org/#/
10/10/2016, 11h23
nanar21

Le fichier écrit en PDF est un fichier ...
Le fichier écrit en HTML est un fichier ... (qui peut appeler d'autres fichiers)

Un fichier a besoin d'un logiciel pour être lu.

Citation:

à cause des multiples logiciels de lecture du format pdf.

Comme tu le sais donc, il peut exister une multitude de lecteurs possibles : différents lecteurs de PDF, différents navigateurs web ...
Et, même s'il n'existait qu'un seul logiciel, il pourrait être configuré différemment ... par le destinataire ( et donc être vu différemment ... )

Un fichier peut être modifié par un logiciel.
Cette modification se fait en mémoire (dans la RAM).

Pour être conservée, toute modification doit être enregistrée ( sur le serveur d'un site internet ou sur le disque dur du destinataire ). Dans ton cas, le destinataire doit te renvoyer la version en mémoire ou enregistrée sur son disque dur.

Pour couronner le tout. Le logiciel de lecture et celui d'édition peuvent être différents ! ...

C'est le cas côté HTML.
Un navigateur web n'est pas conçu pour modifier des pages web (mais seulement les afficher)
Heureusement, il existe des éditeurs HTML (pour créer des pages web)

C'est aussi le cas côté PDF.
Certains logiciels ne sont pas conçus pour modifier des fichiers PDF (mais seulement les afficher). Ils sont gratuits. Actuellement, les fichiers PDF peuvent même s'afficher directement dans un navigateur web. Heureusement, il existe des éditeurs PDF (pour créer des fichiers PDF). Souvent, payants ...

Ta solution est donc, en même temps que l'envoi, de recommander fortement (= d'imposer) à ton destinataire, l'installation d'un logiciel qui sera capable de modifier ton fichier PDF.

Mais, ton destinataire peut craindre pour sa sécurité.
Il faudra alors aussi le convaincre que ton PDF ne contient pas de virus informatique ...

En effet, si les données ne sont pas claires, illisibles dans un logiciel simple (tel qu'un bloc note), elles sont donc obscures ... et donc peuvent cacher des choses indésirables ...

Le fait que votre incompétence informatique est, elle, évidente (puisque vous utilisez le format PDF), n'est pas de nature à rassurer un destinataire ...

Dans tous les cas, la solution HTML est la meilleure ! ...
Sauf pour les idiots. Et, ils sont nombreux ! ...

Envoyer un PDF, c'est dire publiquement : " Je suis un idiot ! " ( je ne sais pas utiliser la meilleure solution )

A quantité d'informations égale, le poids du fichier PDF est plus lourd ...

Envoyer des PDF c'est encombrer les autoroutes (de l'information)
C'est comme envoyer un semi-remorque pour livrer une pizza ...

Citation:

j'ai regardé les formulaires au format HTML. J'arrive à les créer, à les envoyer par mail mais je n'arrive pas à récupérer les données saisies.

Vous êtes sur la bonne voie. Mais pas (encore) vos destinataires ...
Pour modifier votre fichier (compléter votre formulaire), ils doivent utiliser un logiciel ...

Soit un lecteur/enregistreur de PDF (gratuit)
Soit un navigateur/éditeur HTML (gratuit)

Les lecteurs sont souvent gratuits.
Les éditeurs souvent payants ...

Vous avez constaté qu'il est déjà difficile d'atteindre tous les destinataires avec un fichier PDF (parce que le logiciel que vous utilisez n'est pas le logiciel qu'ils utilisent et que certains lisent votre fichier PDF dans leur navigateur web ...).

Citation:

peut-on gérer des formulaires HTML uniquement par mail et sans passer par la création d'un site web ?

Oui, si vos destinataires ont les compétences requises ...

Or, il existe encore moins de destinataires capables d'utiliser un éditeur HTML.
Vos destinataires sont probablement encore plus incompétents que vous !

Mon conseil.

Passer via un site internet. Vos destinataires n'auront besoin d'aucune compétence. Ils ont déjà installé le logiciel nécessaire pour vous recevoir les réponses. Les formulaires HTML ne présentent pas de risque pour leur sécurité.

Je sais ! Il vous faudra apprendre en plus du HTML ... le CSS, le JavaScript, le PHP et le SQL.

Vous êtes sur la bonne voie.

NB : Si vous cherchez la fortune, dépêchez-vous ...
Si les idiots sont nombreux, les cupides le sont tout autant ...
De plus en plus de sites internet sont créés. Votre part de marché diminue donc déjà !
10/10/2016, 16h51
nanar21

<form action="">

Les données du formulaire (HTML) sont envoyées à une URL ...
(indiquée comme valeur de l'attribut action de la balise form)

Si vous ne disposez pas de site web et si vos destinataires ont installés un serveur Apache, vous pourriez indiquer "http://localhost/..." :ptdr:

Encore faudrait-il que les données envoyées sur leur serveur soient traitées et envoyées dans votre boîte mail.

Bref, il faudrait que vos destinataires aient des compétences supérieures aux vôtres.

Ne vous découragez pas. Créez votre site internet.

Et au lieu d'envoyer par courriel un formulaire HTML, il vous suffira alors d'envoyer un courriel avec un lien (une URL) vers votre formulaire

Un formulaire HTML est plus léger qu'un PDF.
Et un lien (une URL) est encore plus léger qu'un formulaire HTML !

Les autoroutes de l'information seront ainsi encore moins encombrées.

NB : N'oubliez pas que les destinataires détestent être importunés ... Que ce soit par PDF ou HTML. Si vous n'êtes pas certain qu'ils complèteront votre formulaire, abstenez-vous de l'envoyer ...

Si vous faites du mailing, placez deux liens.
Un vers votre formulaire et un autre pour se désinscrire.

S'ils sont intéressés, ils liront votre formulaire.
Sinon, ils auront la possibilité de ne plus être importuné.

Bonsoir,

Ci-dessous, un exemple de code permettant à un simple navigateur de générer un fichier au format PDF. Les fichiers pdfmake.min.js et vfs_fonts.js sont à récupérer à l'adresse :
http://pdfmake.org/#/gettingstarted

Il est donc possible :
- de créer un formulaire,
- de récupérer les données du formulaire,
- de créer le document au format PDF,
Et ce, le code étant exécuté en local.

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
<!doctype html>
<html lang='en'>
  <head>
    <meta charset='utf-8'>
    <script src='pdfmake.min.js'></script>
    <script src='vfs_fonts.js'></script>
    <script>
    var docDefinition = {
      content: [
        { text: 'This is a header', style: 'header' },
        'No styling here, this is a standard paragraph',
        { text: 'Another text', style: 'anotherStyle' },
        { text: 'Multiple styles applied', style: [ 'header', 'anotherStyle' ] }
      ],
      styles: {
        header: {
          fontSize: 22,
          bold: true
        },
        anotherStyle: {
          italic: true,
          alignment: 'right'
        }
      }
    };
    </script>
  </head>
  <body>
    <input type="button" value="Générer le pdf" onclick="pdfMake.createPdf(docDefinition).open();">
  </body>
</html>

10/10/2016, 20h59
Ruyneau

Bonsoir,
merci pour vos réponses. J'apporte quelques précisions sur mes besoins. En fait, il s'agit de dossiers d'inscriptions pour des étudiants (il y en aura à tout casser 200 dossiers) qui comprend plusieurs pages. Comme nous avons déjà des données sur ces étudiants, j'utilisais pdftk et un code python pour pré-remplir le dossier d'inscription au format pdf modifiable. Chaque élève recevait son dossier d'inscription pré-rempli et personnalisé; il pouvait alors finir de le compléter chez lui; il nous le retournait par mail et avec un coup de pdftk et code python, les données complètes étaient transférées dans un fichier .csv ; donc il ne s'agit pas de faire un mailing à grande échelle et tout azimut et c'est pour ces raisons, (mon incompétence en est une autre également...) que j'hésitais à me lancer dans un site vu le faible effectif concerné.

Je vais essayer la dernière réponse (et j'espère réussir).

Encore merci.
Gabriel
11/10/2016, 09h43
nanar21

Pourquoi hésiter ?

Bonjour,

Citation:

Comme nous avons déjà des données sur ces étudiants, j'utilisais pdftk et un code python pour pré-remplir le dossier d'inscription au format pdf modifiable. Chaque élève recevait son dossier d'inscription pré-rempli et personnalisé; il pouvait alors finir de le compléter chez lui; il nous le retournait par mail et avec un coup de pdftk et code python, les données complètes étaient transférées dans un fichier .csv ; donc il ne s'agit pas de faire un mailing.

Merci pour ces précisions. Vous savez programmer (en Phyton) mais vous hésitez à vous

Citation:

lancer dans un site vu le faible effectif concerné

Pourriez-vous être encore plus précis ?

- Avez-vous les compétences requises pour créer un site dynamique ? Par exemple, en PHP/MySQL ?
- Votre école dispose-t-elle d'un site internet ? de son serveur ou fait-elle appel au service d'un hébergeur ?
- Etes-vous autorisé à y publier un formulaire pré-rempli ? (après identification de l'étudiant)

Le but étant de transférer les données complètes dans un fichier .csv, qu'est-ce qui vous fait penser que la solution " fichier CSV > code Python (pdftk) > fichier PDF > envoi courriel > modif PDF > envoi courriel > code Python (recup modif PDF) > fichier CSV" soit plus simple que "fichier CSV > code PHP > MySQL > envoi courriel (avec un lien contenant un identifiant) > interface web > MySQL > code PHP > fichier CSV "

La solution Python-PDF me semble, a priori, lourde (pour le réseau) et risquée (si l'étudiant ne parvient pas à modifier le PDF). Pour moi, la solution passe par une interface web.

Questions subsidiaires.

- D'où proviennent les données de ce fichier CSV ? D'un tableur ? D' Access !!!
Si oui, cela pourrait expliquer votre orientation dans le choix d'une solution.

- Pourquoi préférer stocker des données (de type fiche, ici d'étudiants) dans un fichier plutôt que dans une base ... de données ?

Votre problème ne se situe-t-il pas plutôt dans le choix du stockage de données ?

Le code - quelque soit son langage - ne peut que difficilement corriger une erreur "stratégique". Or, ici, ce qui est stratégique ce sont les données ... Avant de coder, la bonne question à se poser n'est-elle pas : " Dans quel format vais-je stocker mes données ? Pourquoi le CSV et pas la base de données ? "

Citation:

En fait, il s'agit de dossiers d'inscriptions pour des étudiants (il y en aura à tout casser 200 dossiers) ... j'hésitais à me lancer dans un site vu le faible effectif concerné

Pourquoi ? L'école fermera-t-elle ses portes l'année prochaine ?
Sinon, votre problème concerne +/- 180 étudiants ... par an !

Coder, c'est coder !
Le travail du programmeur ne dépend pas du nombre d'étudiants (de clients, d'administrés, ...)

Si vous avez les compétences (et autorisations) requises, n'hésitez plus !
11/10/2016, 11h00
nanar21

Javascript > PDF ou HTML

Bonjour,

S'il est possible de créer des fichiers PDF via du Javascript (ce que j'ignorais), alors il me semble plus simple de créer un fichier HTML via du Javascript.

Ceci dit, envoyer un fichier (PDF, HTML, TXT, ...) par courriel pour le recevoir modifié me semble une solution lourde (pour le réseau).

En l'espèce, créer une interface web est une solution plus élégante.
11/10/2016, 13h10
nanar21

Créer un fichier en JavaScript

Une solution ...

J'ai le sentiment que l'aspect visuel tient une grande place dans le choix de la solution.
NB : Outre la performance, une interface web peut aussi être très jolie.

Si vous savez programmer en Phyton, vous savez créer des fichiers TXT ... Et comme vos étudiants savent modifier un fichier TXT. Ils pourront vous le renvoyer complété (et, s'ils respectent vos instructions, la récupération via un programme écrit en Python sera aisée)
NB : Attention toutefois au retour de ligne ...

L'avantage du HTML - par rapport au TXT - est que l'affichage ne dépend pas du système d'exploitation. Mais l'usage du HTML requiert le respect de règles non seulement syntaxiques mais aussi logiques ...

Mettre en place un formulaire puis ne pas pouvoir cliquer sur un bouton pour envoyer ces données à un serveur n'est pas logique ... Cependant, elles pourraient être utilisées pour créer un fichier.

Excusez ma rudesse et recevez mon remerciement.

Grâce à votre problème et à eleydet , j'ai appris qu'il est possible de créer un fichier (TXT, HTML, PDF, ...) en JavaScript. Mais pour l'enregistrer sur le disque dur de l'étudiant, il faudra son accord ...

Il devra donc faire confiance au fichier ainsi créé et vous le renvoyer en pièce jointe.

Si cette solution vous intéresse,
https://eligrey.com/demos/FileSaver.js/

( Solution risquée pour l'étudiant à n'utiliser que si une interface web ne peut pas être mise en place )
12/10/2016, 19h42
sekaijin

http://stackoverflow.com/questions/2...-html5-and-css

Mais je pense que si c'est un besoin récurent tu devais regarder des outils spécialisés.
http://www.orbeon.com
Ce n'est qu'un exemple.

Cherche xform w3c. La norme était un peu en sommeil avec le taf sur html5. Mais elle est toujours vivante et les outils progressent bien. La norme est en voie vers la v2.

Ce que ca propose c'est une gestion dédié au formulaire. Tu na plus qua t'occuper du contenu. Enfin presque.
A+
12/10/2016, 22h10
Ruyneau

Bonjour,
les données qui servent à pré-remplir les dossiers d'inscription sont au format .csv et je dois les retourner au même format.
Je n'ai aucune compétence dans les langages DHP and co et aucune compétence sur la gestion d'un site et en particulier la gestion de formulaires via site internet; et je ne suis pas sûr d'avoir le temps pour m'y former.

Pour le moment, si je conserve l'optique envoi des formulaires au format HTML, j'arrive à les créer et à intégrer des codes javascript (j'ai du faire des codes javascript intégrer aux champs et boutons de mon dossier d'inscription en PDF modifiable); je sais que j'arrive à les pré-remplir par contre pour le retour, si j'ai bien compris, il faut que l'étudiant transforme grâce à une bibliothèque son fichier html en pdf ou txt ou html car la sauvegarde directe des saisies au format HTML, sans site, est une mission presque impossible et/ou l'envoi avec le bouton <<submit>> ne sera possible que si l'utilisateur a fait les manips nécessaires (donc presque impossible aussi).

Avec la solution de Eleydet, je n'ai pas réussi à intégrer un champ de texte à saisir par l'étudiant; il apparaît bien au format HTML mais lorsque je clique pour générer le pdf il ne me reste que l'en tête; Argh...
J'ai lu la doc, et j'ai l'impression que l'on ne peut pas créer des champs de texte (ou liste ou cas à cocher etc...)

Je vais essayer avec FileSaver mais ce n'est pas gagné.

Merci

Gabriel
12/10/2016, 22h13
Ruyneau

POur orbeon.com, j'ai l'impression qu'il faut avoir un site pour récupérer les saisies; or c'est justement, ce que je ne souhaite pas pour l'instant.
Merci
Gabriel

J'ai réussi à faire un bout de code avec FileSaver mais bon pour l'instant il n'enregistre que le texte en paramètre et je souhaiterais qu'il enregistre tout le contenu de la page HTML; Est-ce possible ou dois-je passer au format pdf ?

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<!DOCTYPE html>
<html>
<head>
<title>INSCRIPTION</title>
<script src="http://cdn.jsdelivr.net/g/filesaver.js"></script>
<script>
      function SaveAsFile(t,f,m) {
            try {
                var b = new Blob([t],{type:m});
                saveAs(b, f);
            } catch (e) {
                window.open("data:"+m+"," + encodeURIComponent(t), '_blank','');
            }
        }
</script>
</head>
<form>
Code postal : <input type="text" size="5" name="code_postal" maxlength="5">
<input type="reset"  value="Reset" /> 
<input type="button" value="clique" onclick="alert('coucou');" />
<input type="button" value="transfert" onclick="SaveAsFile('essai','filename.html','text/plain;charset=utf-8');" /> 
</form>
</html>

Gabriel

13/10/2016, 07h29
sekaijin

orbeon n'est qu'un exemple
regarde la norme Xform et ses implémentations je pense qu'il y a ce que tu cherche.

A+JYT

Citation:

Avec la solution de Eleydet, je n'ai pas réussi à intégrer un champ de texte à saisir par l'étudiant; il apparaît bien au format HTML mais lorsque je clique pour générer le pdf il ne me reste que l'en tête; Argh...
J'ai lu la doc, et j'ai l'impression que l'on ne peut pas créer des champs de texte (ou liste ou cas à cocher etc...)

Ce à quoi je pensais :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<!doctype html>
<html lang='en'>
  <head>
    <meta charset='utf-8'>
    <script src='pdfmake.min.js'></script>
    <script src='vfs_fonts.js'></script>
    <script>
      creer_pdf=function() {
        var nom=document.getElementById("nom").value;
        var prenom=document.getElementById("prenom").value;
        var doc = {
          content: [
            'Votre nom : '+nom,
            'Votre prénom : '+prenom
          ],
        };
        pdfMake.createPdf(doc).open();
      };
    </script>
  </head>
  <body>
    Votre nom : <input id="nom"><br>
    Votre prénom : <input id="prenom"><br>
    <input type="button" value="Générer le pdf" onclick="creer_pdf();">
  </body>
</html>

13/10/2016, 10h09
Ruyneau

Bonjour,
merci pour votre réponse avec l'exemple qui va me servir pour une partie de mon travail; par contre elle ne va pas m'aider pour récupérer les saisies. En effet, j'utilisais pdftk pour générer le fichier .fdf (qui récupère les données saisies dans les champs pdf) et là du coups, je ne pourrai pas récupérer les champs saisis .

Je vais voir avec Xform
Bonne journée.
Gabriel
13/10/2016, 10h16
SpaceFrog

il me semble que l'on pouvait faire un mailto: dans le submit du form qui envoyait un fichier formaté à une adresse mail, ça peut être une solution pour contourner l'emploi du pdf...
13/10/2016, 12h02
Ruyneau

Bonjour,
Je pense que pour que le mailto fonctionne, il faut que l'utilisateur configure certains paramètres. J'ai essayé et je n'ai pas réussi à faire fonctionner le <<mailto>>

Bonjour,
Voici un premier essai avec Xform qui ne fonctionne pas.

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<?xml version="1.0" encoding="iso-8859-1"?>
<?xml-stylesheet href="xsltforms/xsltforms.xsl" type="text/xsl"?>
<html xmlns="http://www.w3.org/1999/xhtml"
 xmlns:h="http://www.w3.org/1999/xhtml"
 xmlns:xf="http://www.w3.org/2002/xforms"
 xmlns:ev="http://www.w3.org/2001/xml-events"
 xmlns:xsd="http://www.w3.org/2001/XMLSchema"
>
<head>
	<title>INSCRIPTION</title>
	<style type="text/css">
	body { font-family: sans-serif}
	label { display: inline-block; width: 8em; margin: 0 1em; text-align: right }
	</style> 
	<model xmlns="http://www.w3.org/2002/xforms">
	   <instance><donnees xmlns=""><prenom/><nom/></donnees></instance>
	<submission action="file://resultats.xml" method="put" id="recup"/>
	</model>
</head>
<body>
<input type="text" name="prenom" value="Prénom Etudiant">
<br>
<input type="text" name="nom" value="Nom Etudiant">
<group xmlns="http://www.w3.org/2002/xforms">
<submit submission="recup"><label>Récupérer</label></submit>
</group>
</body>
</html>

Le bouton récupérer ne fonctionne pas; de plus j'ai essayé la syntaxe <xf:>..</xf> qui ne fonctionne pas non plus.
Argh.
Certainement des fautes de débutant lent.
De plus je ne vois pas comment récupérer les données nom et prenom et le transférer dans le fichier.
Merci pour vos aides que je pourrai jamais vous rendre.
Gabriel

Citation:

faire un mailto: dans le submit du form qui envoye un fichier à une adresse mail, ça peut être une solution pour contourner l'emploi du pdf ...

Exact. Encore faut-il que l'étudiant ait installé un logiciel de messagerie.

( Perso, pour éviter la contamination et perdre de l'espace disque, je ne rapatrie jamais de courriels sur mon disque dur. Bref, tous mes courriels restent sur le serveur et je n'ai nul besoin d'un logiciel de messagerie. J'utilise exclusivement un webmail )

NB : Autre problème de cette "solution". Les données renvoyées (issues du formulaire complété) ne sont pas "sûres". Même si via du JavaScript les réponses non-plausibles peuvent être rejetées, un étudiant tordu pourrait modifier le fichier généré avant son envoi ...

Code HTML pour créer un courriel :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 <!DOCTYPE html> <html lang="fr"> <head> <meta charset="UTF-8"> <title></title> </head> <body> <form action= "mailto:adress@ecole.fr?subject=Votre%20formulaire%20compl%C3%A9t%C3%A9&body=Bonjour%20..." name="envoi" method="post" enctype="text/plain" id="envoi"> <input name="envoyer" type="submit" value="Envoyer"> </form> </body> </html>
Ce code appelle le logiciel de messagerie.

Mais comme je n'ai pas de logiciel de messagerie, ce code n'a pas été testé.
Toutefois, il devrait créer un courriel ayant comme "subject" : Votre formulaire complété
et comme "body" : Bonjour ...

Voir 40 message(s) de cette discussion en une page