PDA

View Full Version : How can I display mailto code output on a different webpage



Stack
05-27-2015, 02:01 PM
I want to use mailto code to send emails to my clients through my secured webpage and below is the link for my code

http://codepen.io/anon/pen/vOyVVQ

whenever I refresh the page the links in iview box disappear, but I want them to stay even if I refresh it n number of times
I want to display the same output multiple times with different mailto email
ids on the same page
I want to pre populate the subject line and the body just as same as the link text whenever I click update.
I want to display only the output on a different page as well.


<html lang="en"><head><meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<meta charset="windows-1252">
<meta name="viewport" content="width=device-width, initial-scale=1">

</head><body>
<article id="lcol">

<section id="doc">

<form id="gen" name="gen" style="padding:8px; ">
<p><input style="display:none;" type="text" id="T1" name="T1" tabindex="1" placeholder=""></p>
<p><input type="text" id="T2" name="T2" tabindex="2" placeholder="To list" ></p>
<p><input type="text" id="T3" name="T3" tabindex="3" placeholder="CC list"></p>
<p><input style="display:none;" type="text" id="T5" name="T5" tabindex="5" ></p>
<p><textarea style="display:none;" rows="3" id="TA1" name="TA1" tabindex="6" style="color: rgb(0, 0, 0);" ></textarea></p>
<p>
<input type="button" value="Update" name="B1" onclick="GenerateButton()" tabindex="7" class="btn">
</p>
<p><textarea style="display:none;" rows="" id="TA2" name="TA2" tabindex="9" wrap="on"></textarea>
</p>
<div id="dview"><iframe id="iview" name="iview" style="width: 200px; height: 55px; position:absolute; left:200px; top:30px;" ></iframe></div>
</form>

<script type="text/javascript">
<!--
var text,TA1,TA2;
window.onload = function()
{
TA1 = gen.TA1;
TA2 = gen.TA2;
//ResetButton();
}
function GenerateButton()
{
var txt = '<a href="mailto:';
var i=0;
var head,to,cc,subject,body;
T1 = gen.T1;
T2 = gen.T2;
T3 = gen.T3;

T5 = gen.T5;
TA1 = gen.TA1;
TA2 = gen.TA2;
head = T1.value;
to = T2.value;
cc = T3.value;
subject = T5.value;
body = TA1.value;
subject = encodeURIComponent(subject);
body = encodeURIComponent(body);


//subject = subject.replace(/ /g,"%20");
//body = body.replace(/ /g,"%20");
//body = body.replace(/\r\n|\n|\r/g,"%0D%0A");

if( to!='' )
txt += T2.value;
else
txt += "";
if( cc!='' )
{
txt += (i++==0?'?':'&amp;');
txt += 'cc=';
txt += cc;
}
if( subject!='' )
{
txt += (i++==0?'?':'&amp;');
txt += 'subject=';
txt += subject;
}
if( body!='' )
{
txt += (i++==0?'?':'&amp;');
txt += 'body=';
txt += body;
}
txt += '">';
if( head!='' )
txt += head;
else
txt += "Payment not recieved";
txt += '</a>';
TA2.value = txt;
OnUpdateView();
}


function OnUpdateView()
{
window.frames["iview"].document.body.innerHTML = TA2.value;
}
function ResetButton()
{
T1.style.color = "#aaa";
T2.style.color = "#aaa";
TA1.style.color = "#000";
TA1.value = text;
window.frames["iview"].document.body.innerHTML = text;
}

function Newline()
{
s = getSelect(TA1);
newline = "%0D%0A";
text = TA1.value;
fillString(text, newline, s.start, s.end);
pos = s.start+newline.length;
setCaret(pos);
TA1.focus();
}
function getSelect(obj)
{
TA1 = gen.TA1;
var s = obj.selectionStart;
var e = obj.selectionEnd;
var txt = obj.value.substring(s,e);
return { start: s, end: e, text: txt };
}
function fillString(text, selectText, start, end)
{
// split textarea value into three pieces: before startPosition,
// startPosition until endPosition, and after endPosition
var str1 = text.substring(0,start);
var str2 = text.substring(start,end);
var str3 = text.substring(end,text.length);
// replace str2 with formatted substring (selectedText)
str2 = selectText;
TA1.value = str1+str2+str3;
}
function setCaret(pos)
{
TA1.selectionStart = pos;
TA1.selectionEnd = pos;
}

//-->
</script>


<!-- #EndEditable -->
</section>
</article>


<!-- #EndTemplate -->
</body>
</html>