I have written some code for template generator but I am having issue getting the formatting when it is generated in the <textarea></textarea>.
I want to have it to look like
Service Affected: {then populated text}
Service Status: {again populated text}
Current/Next Actions: {populated text}
it ends up printing out the <br>
Service Impacted: data<br />Service Status : lost comms<brNext Action : carrier invest<br>
here is the code I have written.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script language="JavaScript">
function generate()
{
var sms = ''
var impact = document.sms.impacted.value;
var status = document.sms.status.value;
var action = document.sms.action.value;
var BR = '<br>'
sms = sms + '<textarea name="template" rows="10" cols="55">';
sms = sms + 'Service Impacted: '+ impact + '<br />';
sms = sms + 'Service Status : '+ status + '<br>';
sms = sms + 'Next Action : '+ action +'<br>';
sms = sms + '</textarea>';
document.getElementById('sms').innerHTML=sms;
//document.getElementById('blank').innerHTML='';
}
</script>
<link href="scripts/imt.css" rel="stylesheet" type="text/css" />
</head>
<body>
<script type="text/javascript">
<!--
-->
</script>
<div id="page">
<div id="wrapper">
<div id="header"></div>
<div id="topSpacer"></div>
<div id="body">
<h2 align="center">The Fault logging assistant</h2>
<h3 align="center"></h3>
<form name="sms" action="">
<table name="table" width="500" border="0" align="center">
<tr align="center">
<td colspan="2">
<h3>SMS Template Genterator</h3>
</td>
</tr>
<tr>
<td><strong>Service Impacted: </strong></td>
<td>
<input type="text" name="impacted" value="">
</td>
</tr>
<tr>
<td><strong>Service Status: </strong></td>
<td>
<input type="text" name="status" value="">
</td>
</tr>
<tr>
<td><strong>Next Action: </strong></td>
<td>
<input type="text" name="action" value="">
</td>
</tr>
<td><input type="button" name="button" value="Generate" onClick="generate()">
<tr>
</tr>
<tr>
<td colspan="2">
<span id='sms'></span>
</td>
</tr>
</table>
<span id="blank"></span>
</form>
</div>
<div id="bottomSpacer"></div>
<div id="footer">
</div>
</div>
</div>
</body>
</html>