Bruke jQuery til å generere html med brukerstyrt input

[dimdal]

Hei!

 

Jeg forsøker å få til følgende ved bruk av jQuery:

 

Bruker skal generere en HTML-email basert på egendefinert input.

 

1. Brukeren presenteres med en rekke felter hvor han skal skrive inn verdier som deretter skal settes direkte inn i en ferdig HTML-mal (i hovedsak tekster).

 

2. Ved et knappetrykk skal brukeren få presentert hvordan det hele blir seende ut, før han enkelt skal kunne laste ned den ferdige HTML-filen som skal brukes som e-post.

 

Hvordan gjør jeg dette enklest mulig? Må jeg bruke f.eks. PHP, eller kan det la seg gjøre med kun javascript? Eventuelt hvordan?

 

På forhånd takk

[phenalor]

om du kun skal fylle ut en ferdigdefinert mal med verider fra input-felter, klarer du deg nok med javascript.

 

problemet er om du ma ha en nedlastbar fil, da ma du nok bruke php, eventuelt med ajax.

 

ekempel:

 

(knapp).addEventListener('click', function() {
 (felt1).innerHTML = (input1).value;
 ...
 ...
 ...
});

Endret 26. oktober 2011 av phenalor

[dimdal]

Flott! Neida, trenger ikke en nedlastbar fil - men trenger at man kan både se resultatet og hente ut HTML-koden fra en tekstboks.

 

Mailen som skal forhåndsvises kan jeg eventuelt presse inn i en div, men koden må jeg ha slik at den enkelt kan kopieres ut og limes inn i en ny fil.

 

Men; Utfordringen min er at jeg ikke klarer å sette inn verdier i en <textarea>. Når jeg med jQuery velger ID-en til elementene jeg skal sette inn variabelverdiene i, så skjer det ingenting. F.eks. ligger det i textareaen:

 

<textarea>
<div id="verdi"></div>
</textarea>

 

Og jeg bruker følgende jQuery-kode til å sette inn verdien:

$('#verdi').html(inputvariabel);

 

Men ingenting endres i det som ligger innenfor textarea. Hva gjør jeg galt?

 

Skisse:

[torbjørn marø]

Men; Utfordringen min er at jeg ikke klarer å sette inn verdier i en <textarea>. Når jeg med jQuery velger ID-en til elementene jeg skal sette inn variabelverdiene i, så skjer det ingenting. F.eks. ligger det i textareaen:

 

<textarea>
<div id="verdi"></div>
</textarea>

 

Og jeg bruker følgende jQuery-kode til å sette inn verdien:

$('#verdi').html(inputvariabel);

 

Men ingenting endres i det som ligger innenfor textarea. Hva gjør jeg galt?

 

Du kan vel ikke ha en div inne i en textarea?! Sett id'en på textarea i stedet. I jQuery-linjen antar jeg du må sette text, ikke html. Har ikke gjort noe sånt før, men ville prøvd det..

 

Interessant å løse dette i ren JavaScript forresten. Har aldri tenkt på denne muligheten før, men bør funke..

Endret 27. oktober 2011 av torbjørn marø

[phenalor]

Har desverre ikke noen erfaring med jQuery, men om du lurer pa hvordan man kan fylle et textfelt med html'en som ble generert, tipper jeg dette vil funke:

 

(textarea).value = (generert HTML rotnode).innerHTML;

[dimdal]

Hei folkens, og takk for masse hjelp! Nå har jeg snart en ferdig løsning, dog er det sikkert mye rotete og vanskelig kode i forhold til slik det bør gjøres.

 

Tror jeg må lete opp en god tutorial på hvordan man behandler user input. Fordi nå har jeg veldig mye kode for å ta imot input fra totalt 50 input-felt. Det gir en del linjer kode!

[dimdal]

Her ligger forresten en beta, for de som er interessert:

http://www.mariusorvik.com/javascript2/email.html