EMail Formular und CSV Import, Vorlagen?

[hmm]

Hi Leute,

ich brauch für meine Webseite noch zwei Dinge:

1. Ein Formular mit dem mir Besucher EMails schicken können. Das könnte ich per Node-Mailer coden, aber das würde dauern und wäre hässlich. Kennt ihr frei verfügbare, schlanke Vorlagen hierfür? Idealerweise nur mit Node und JS, ohne PHP?

2. Meine Anwendung braucht Daten, ich denke es wäre gut diese Daten in Form eines CSV Imports zu bekommen. Gibt es für das Einlesen irgendwelche Vorlagen die ich verwenden kann? Der Anwender ist auf meiner Webseite und klickt auf einen Knopf und wählt dann eine CSV Datei von seinem Rechner und Importiert diese auf meine Webseite. Gibt es für sowas Vorlagen?

Ich möchte meinen Besuchern auch Vorlagen für das aussehen der CSV Dateien bieten, da würde ich dann einfach einen "CSV Vorlage Download" Knopf machen und per SendFile (NodeJS Express) eine passende CSV Datei verschicken, oder macht man das besser anders?

[hmm]

hi leute,

mein Kontaktformular funktioniert jetzt:

        <div class="featurette" id="contact">
            <h2 class="featurette-heading">Kontaktformular
            </h2>
            <form id="kontaktformular" name="kontaktformular" method="post" action="/mail">
            	<div>
            	  <label for="absender">Ihre E-Mail-Adresse:</label>
            	  <input type="text" id="absender" name="email" />
            	</div>
            	<div>
            	  <label for="nachricht">Ihre Nachricht:</label>
            	  <textarea id="nachricht" name="text" cols="100" rows="10"></textarea> 
            	</div>
            	<div>
            	  <input type="submit" value="Abschicken" />
            	</div>
            </form>
        </div>

und der email server:

app.get('/app', function(req, res) {
     res.setHeader('Content-Type', 'application/json');
     var str = shell.exec('python test.py').stdout;
     console.log("output: " + str);
     res.send(JSON.stringify({ antwort: str}));
 });
 
 app.post('/mail', function (req, res) {
	// hier verschicken wir die email
	var nodemailer = require('nodemailer');
    
    var transporterObjectConfig = nodemailer.createTransport({
    host: 'exchange.tu-berlin.de',
    port: '587',
    secure: false,
    requireTLS: true,
    auth: {
    user: '[e-mail]',
    pass: 'geheim'
    }
    });
    
	var mailOptions = {
        from: req.body.email,
        to: '"Christopher" <[e-mail]>',
        subject: 'Kontaktanfrage', 
        text: req.body.text, 
        html: req.body.text 
    };

    transporterObjectConfig.sendMail(mailOptions, function(error, info){
        if(error){
            return console.log(error);
        }
        res.send('Vielen Dank für Ihre Anfrage, wir werden Sie in kürze beantworten.');
    });
});

leider ist das ganze nicht richtig responsive, was wohl mit dem cols und rows zusammenhängen könnte. wie kann ich das richtig responsive machen? wie kann ich das formular aufhübschen?

ich möchte das besucher csv dateien von ihrem rechner auf meine webseite hochladen können, wie realisiert man sowas? ich bräuchte quasi eine javscript funktion die clientseitig eine datei aus dem verzeichnis des webseitenbesuchers einließt (die schick ich dann als json per node js an meinen server)

hier mal der link zur webseite, wo ihr das kontaktformular sehen könnt:

http://zonotope.azurewebsites.net/#contact

[Matthias Apsel]

Hallo hmm,

leider ist das ganze nicht richtig responsive, was wohl mit dem cols und rows zusammenhängen könnte. wie kann ich das richtig responsive machen?

mit CSS für die Formularelemente. Z.B. max-width: 100vw;

wie kann ich das formular aufhübschen?

mit CSS

ich möchte das besucher csv dateien von ihrem rechner auf meine webseite hochladen können, wie realisiert man sowas?

<input type="file">

ich bräuchte quasi eine javscript funktion die clientseitig eine datei aus dem verzeichnis des webseitenbesuchers einließt (die schick ich dann als json per node js an meinen server)

Nein, nutze HTML.

http://zonotope.azurewebsites.net/#contact

2 Kleinigkeiten

Bis demnächst
Matthias

[hmm]

danke.

app.post('/app', function(req, res) {
    console.log(req.body.datei);

liefert leider ein undefind.

            	<form method="post" enctype="multipart/form-data" action="/app">
            		<label> Wählen Sie eine Excel Datei (*.csv) von Ihrem Rechner aus.
            			<input name="datei"
            			type="file" size="50" accept="text/*"> </label>
            		<input type="submit" value="Hochladen und Gantt-Chart erstellen" />
            	</form>

warum ist das undefind? wie lese ich das inputfeld namens datei in javascript?

[Martl]

Hallo hmm,

wie lese ich das inputfeld namens datei in javascript?

grundsätzlich so: getElementsByName

Grüße, Martl

[hmm]

ok. Ich habe mir das Input Element über die ID geholt und über das Attribute value den Pfad zur Datei bekommen. Lese ich die Datei jetzt mit einem Reader ein?