Avatar billede mrjuul Nybegynder
03. februar 2012 - 10:16 Der er 15 kommentarer og
1 løsning

Dynamisk mailto to afcheckede personer

Hvis jeg har en html tabel med N antal personer i ala:

Person1  Email1  Checkbox1 (X)
Person2  Email2  Checkbox2 (-)
...
PersonN  EmailN  CheckboxN (X)

Er der så en nem måde at indsætte en send mail til afcheckede personer på siden, således at ovenstående vil lave en mailto med person1 og personN.

Et eksempel vil være rart.
Avatar billede jokkejensen Novice
03. februar 2012 - 11:04 #1
jeg bruger altid jquery:

Psuedo:
<input type="checkbox" value="email@email.dk" name="emailList" />
<input type="checkbox" value="email2@email.dk" name="emailList" />
<input type="checkbox" value="email3@email.dk" name="emailList" />
<input type="checkbox" value="email4@email.dk" name="emailList" />

<a href="#" id="sendMail">Send til valgte emails</a>

<script>
$(document).ready(function(){

$("#sendMail").click(function(){

var emails = "";
var selectedCount = $("input[name=emailList]:checked").length;
if(selectedCount > 0)
{
  $("input[name=emailList]:checked").each(function(){
    emails += $(this).val() + ";"
  });
  $(this).attr('href', emails);
  return true;
}else
{
// ingen checkboxes er valgt.
}


});

});
</script>
Avatar billede olsensweb.dk Ekspert
03. februar 2012 - 11:45 #2
prøv dette (hurtigt tested på thunderbird)


<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <title></title>
    <style type="text/css">
    </style>
    <script type="text/javascript">
        function StartMailProgram(frm, boxname){
            var to ="";
            var antal = 0;
            var lng = document[frm][boxname].length;    
            for(var k=0; k<lng;k++){
                if (document[frm][boxname][k].checked){
                    to +=document[frm][boxname][k].value +" ; ";
                    antal++;
                }
            }
            if(antal){           
                to = to.slice(0, -3);
                window.location = "mailto:"+to;
                /*
                var emne ="test mail";
                var msg="herer en forud defineret tekst";               
                window.location = "mailto:"+to+"?subject="+emne+"&body="+msg;               
                */               
            }
            else{
                alert("ingen modtagere valgt");
            }           
        }
    </script>
</head>
<body>
<form id="form1" name="form1" method="post" action="">
    <label> <input type="checkbox" name="CheckboxGroup" value="jan@totalpetrolium.dk"  /> Jan Monrad</label> <br />
    <label> <input type="checkbox" name="CheckboxGroup" value="Søren@monradogrislund.dk"  /> Søren Rislund</label><br />
    <label> <input type="checkbox" name="CheckboxGroup" value="palle@gulballe.dk"  /> palle gulvballe</label><br />
    <input type="submit" name="send" id="send" value="Submit" onclick="StartMailProgram('form1', 'CheckboxGroup')" />
</form>
</body>
</html>


men kan du altid værer sikker på bruger har et mail program til rådighed ??, det kunne jo værer brugeren ikke sidder på egen maskine.
jeg ville overveje at anvende en form mail istedet, men det kræver noget server side code
Avatar billede jokkejensen Novice
03. februar 2012 - 12:40 #3
var antal = 0;

if(antal)
vil den ikke altid være sand ?

Mener du ikke if(antal > 0)

/J
Avatar billede jokkejensen Novice
03. februar 2012 - 12:52 #4
Desuden returnere du ikke false på din onsubmit, så den kalder action="" som er ugyldigt.

/J
Avatar billede olsensweb.dk Ekspert
03. februar 2012 - 14:15 #5
if(antal)
vil den ikke altid være sand ?

nope, alle andre tal end 0 eller stringe er true, men selvføgelig if(antal > 0) ville også kunne anvendes, det er et spm om stil, så en værdi på feks -1 vil også være true

Desuden returnere du ikke false på din onsubmit, så den kalder action="" som er ugyldigt.
det skulle ikke have været en submit button, men en alm button
<input type="submit" skulle være <input type="button"

men der er der plads til forbedringer/optimeringer
Avatar billede jokkejensen Novice
03. februar 2012 - 15:01 #6
1: Okay, smart - tænker slet ikke på mulighederne er vandt til C#, og bruger syntax derfra.

2: heh mit er nu slet ikke testet, og det kan man jo ikke sige om dit :)
Avatar billede olebole Juniormester
03. februar 2012 - 17:00 #7
<ole>

De fleste, som koder andet end JavaScript og PHP ville nok kalde det "et spørgsmål om god eller dårlig kodestil"  *o)

Desværre er både JS og PHP irriterende sloppy på dette punkt - hvilket potentielt giver masser af problemer, hvis man gør det til sin stil.

"Desuden returnere du ikke false på din onsubmit, så den kalder action="" som er ugyldigt." >> Det er helt nyt for mig! Kan du ikke vise, hvor du finder den oplysning?

/mvh
</bole>
Avatar billede jokkejensen Novice
03. februar 2012 - 17:58 #8
HTML4;

http://www.w3.org/TR/html4/interact/forms.html#h-17.3

action      %URI;          #REQUIRED -- server-side form handler --

#REQUIRED betyder den er krævet. Og en tom er ikke gyldig, det bør de fleste validatore også infomere om.

HTML5
http://www.w3.org/TR/html5/association-of-controls-and-forms.html#dom-fs-action


Men det er vel bare at validere en formular med en tom action attribut, eller uden.

/J
Avatar billede jokkejensen Novice
03. februar 2012 - 17:59 #9
jeg manglede lige det fagudtryk for at en variable ikke er en type, ex var = 0, kan være en int eller en bool, men i ex C# skriver man int = 0 bool = 0;

Hedder det typestærke ? eller hvad er det man kalder det ?
Avatar billede olebole Juniormester
03. februar 2012 - 18:08 #10
"#REQUIRED betyder den er krævet. Og en tom er ikke gyldig, det bør de fleste validatore også infomere om." >> #REQUIRED betyder, at den skal være til stede i et FORM-tag. Fuldstændig ligesom alt attributten på et IMG-tag.

Begge må gerne være tomme - hvilket W3C's validator da også er helt enig i. Det tror jeg også de, du tænker på, er. Ellers fejler de  =)

Ja, det er typestærk adfærd. I min egen JS- og PHP-kode bruger jeg f.eks. aldrig skiftevis forskellige typer i én og samme variabel, selvom det er muligt. Jeg anvender også (næsten) altid === og !== i stedet for == og !=.
Avatar billede jokkejensen Novice
03. februar 2012 - 19:46 #11
Validation Output: 1 Error

Line 35, Column 54: Bad value for attribute action on element form: Must be non-empty.
<form id="form1" name="form1" method="post" action="">
Syntax of IRI reference:
Any URL. For example: /hello, #canvas, or http://example.org/. Characters should be represented in NFC and spaces should be escaped as %20.


fra w3c hvis jeg validere ronols kode, så jo den skal indeholde en URL..

Men da en ALT tekst til et billede ikke har noget krævet format som en action attribut på en form (der forventer en URL), godkender den en tom streng, det kan vi hurtigt blive enige om.

/J
Avatar billede jokkejensen Novice
03. februar 2012 - 19:49 #12
http://www.w3.org/TR/html4/struct/objects.html#edef-IMG

klik "alt", der er ingen krav til formatet.

men tager vi ex en <form> igen, må den ikke have en tom name attribut. (godt nok taget lidt ud af kontext, men du nævner selv alt tekst til billede, når vi taler action til en form.)


/J
Avatar billede olebole Juniormester
03. februar 2012 - 20:25 #13
Nu må jeg lige høre, om du validerer koden mod en gældende standard? Jeg refererer naturligvis til HTML4.01 - uagtet, at ronols har valgt at skrive HTML5. Jeg bemærker naturligvis også, at du selv refererer til HTML4, når du ønsker at understrege en pointe om alt attributten.

En tom action er helt valid i HTML4.01. Den forventes at indeholde en HTTP URI, men har den et andet format, er den stadig valid - der er blot ikke defineret en handling for en tom streng. En tom name attribut er ligeledes fuldt valid i HTML4.01.

En tom href såmænd også valid i HTML4.01 - og i øvrigt også i HTML5.

Siden jeg for 13-14 år siden begyndte at kode PHP - og dermed fik brug for formularer - har der ikke eksisteret en browser (til PC- eller mobilbrug), som ikke pr. default har sendt formen til dokumentet selv, når action attributten var tom. Jeg kan så ikke udtale mig i detaljer om browsere før Netscape 2.0 og Explorer 3.0  =)
Avatar billede mrjuul Nybegynder
06. februar 2012 - 16:19 #14
Tak for svar begge to, jeg startede med Ronolos løsning da jeg helt ville være fri for at loade et helt library blot for et mail link.

Eksemplet virker fint, men da jeg skulle sætte det ind i på siden (som er semi genereret), finder jeg ud af jeg jeg ikke har mulighed for at lave en form omkring felterne, så den kig ikke :/

Så skiftede til Jokkejensen's eksempel med jquery, som ikke kræver en form og den virkede fint.

Dog skal det være:

$(this).attr('href', 'mailto:' + emails);

Hvis det er muligt vil jeg gerne give jer begge point for hjælpen.
Avatar billede olsensweb.dk Ekspert
06. februar 2012 - 19:06 #15
får du her
Avatar billede jokkejensen Novice
15. februar 2012 - 15:09 #16
nu har jeg ikke set dit site, men:

"at jeg helt ville være fri for at loade et helt library blot for et mail link."

de 19kb hostet på CDN, kunne måske hurtigt reddes et andet sted :), evt bare ved en enkelt uhensigsmæssig billede komprimering, eller manglende gzip af dit html.

/J
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester