943,903 Members | Top Members by Rank

Web Development > JavaScript / DHTML / AJAX > Converting document.writeln output to textarea box
Ad:
Permalink
Nov 18th, 2008
0

Converting document.writeln output to textarea box

Expand Post »
I was just wondering if there was any easy way to convert a document.writeln output to display inside a textarea box in a form. I recently had done an airline reservation assignment (enter 1 for first class, enter 2 for economy class) assignment with all output just written to a blank webpage with window.prompts. Now my teacher wants us to get input (enter 1 or 2) from a textbox and to display all the output inside a textarea box inside a table. Any help? Ill post the code if that helps at all on request. -thanks
Reputation Points: 10
Solved Threads: 0
Newbie Poster
collegestudent is offline Offline
2 posts
since Nov 2008
Permalink
Nov 18th, 2008
0

Re: Converting document.writeln output to textarea box

This will do it! The value of the input box retrieved, and the output division updated. Creating HTML and inserting it into the document which means that html tags you typed will be appropriately processed. Hope it helps...

javascript Syntax (Toggle Plain Text)
  1. <html>
  2. <head>
  3. <title><!--Sample--></title>
  4. <style type="text/css">
  5. <!--
  6. @media screen, handheld {
  7. html, body { margin: 0; padding: 0; }
  8. body { 
  9.      color: #708090;
  10.      font: 70%/1.5em 'Lucida Console', 'courier new', monospace;
  11.      text-align: center;
  12. }
  13. p { 
  14.      float: left;
  15.      clear: both;
  16.      font: normal 12px Verdana, Helvetica, Arial, sans-serif;
  17.      color: #696969;
  18.      margin: 2px 0 10px 10px;
  19.      padding: 0; 
  20. }
  21. b {
  22.      color: green;
  23. }
  24. label { 
  25.      float: left;
  26.      font-size: 14px;
  27.      font-weight: bold;
  28.      text-transform: uppercase;
  29.      margin: 5px 0 5px 10px; 
  30.  }
  31. input {
  32.      width: 200px;
  33.      font-size: 12px;
  34.      font-weight: bold;
  35.      float: left;
  36.      clear: both;
  37.      color: green;
  38.      margin-left: 10px;
  39.      padding: 2px;
  40.      border: 1px solid #eee;
  41. }
  42. #wrapper {
  43.      width: 700px;
  44.      margin-top: 0;
  45.      margin-right: auto;
  46.      margin-bottom: 0;
  47.      margin-left: auto;
  48.      text-align: left;
  49.      padding: 0;
  50. }
  51. #output {
  52.      width: 710px;
  53.      float: left;
  54.      margin: 0;
  55.      padding: 5px;
  56.      width/**/:/**/ 700px;
  57.  
  58. }
  59. .spacer {
  60.      width: 700px;
  61.      height: 60px;
  62.      float: left;
  63.      margin: 0;
  64.      padding: 0;
  65. }
  66.  
  67. #generate {
  68.      width: 700px;
  69.      float: left;
  70.      margin: 0 auto;
  71.      padding: 0;
  72. }
  73. #generate form {
  74.      width: 600px;
  75.      height: auto;
  76.      position: relative;
  77.      float: left;
  78.      margin: 0;
  79. }
  80. -->
  81. </style>
  82. <script type="text/javascript">
  83. <!--
  84. document.onkeyup = function(e) {
  85. var e = e ? e : window.event;
  86. var t = e.target ? e.target : e.srcElement;
  87.      if ( (t.name) && (t.name == 'txt') ) {
  88.      var ie = document.all;
  89.      var m = document.getElementById;
  90.      if (ie) {
  91.      ie.output.innerHTML = t.value; }
  92.      else { m('output').innerHTML = t.value;
  93.           } 
  94.      }
  95. }
  96.  
  97. //-->
  98. </script>
  99. </head>
  100. <body>
  101. <div id="wrapper">
  102. <div id="output"></div>
  103. <div class="spacer"></div>
  104. <div id="generate">
  105. <form action="#" name="frm1" onsubmit="return false;">
  106. <label>Code Input:</label>
  107. <p> Enter an <b>&lt;HTML&gt;</b> code and see the results above. </p> 
  108. <input type="text" name="txt" value="" />
  109. </form>
  110. </div>
  111. </div>
  112. </body>
  113. </html>
Featured Poster
Reputation Points: 114
Solved Threads: 138
Posting Shark
essential is offline Offline
973 posts
since Aug 2008
Permalink
Nov 20th, 2008
0

Re: Converting document.writeln output to textarea box

<?xml version = "1.0"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns = "http://www.w3.org/1999/xhtml">

<head>
<title>Airline Reservation System</title>

<form id="ourForm" name="myform" >
<table>
<tr><td>Enter 1 for Economy Seat, 2 for First Class</td><td><input type="text" name="box1" size="5"/></td></tr>
<tr><td>Result</td><td><textarea name = "textarea" rows="40" cols="70"/></textarea></td></tr>
<tr><td><input type="button" value="Submit" name="button1"onClick="startArray()"></td>
<td><input type="reset" value="Clear" name="button2"></td></tr></table>
</FORM>
<HEAD>

<script type = "text/javascript">
<!--
var input;
var secondInput;
var element;
var secondElement;
var firstCount = 0;
var economyCount = 0;
var seats = [ ,0,0,0,0,0,0,0,0,0,0]; //allocate 10-element Array

function startArray()
{

formRef = document.getElementById;
input = document.myform.box1.value;
formRef.box1.value="";

for(var i=0; i<11; i++)
{
if (input == 1 || input = 2)
{
element = linearSearch(seats);
if (element == -1 && input == 1)
{
document.myform.textarea.value=("The First Class is already fully booked\n");
secondQuestion(seats);
}
else if (element == -1 && input == 2)
{
document.myform.textarea.value=("The Economy Class is already fully booked\n");
secondQuestion(seats);
}
else
boardingPass(input);
}
//to terminate the program
else
{
document.myform.textarea.value=("Bye-bye!");
System.exit(0);
}}}

function linearSearch(theArray)
{
if (input == 1)
{
for (var n=0; n<6 ; n++)
if (theArray [n] == 0)
return n;
}
else if (input == 2)
{
for (var n=6; n<11 ; n++)
if (theArray [n] == 0)
return n;
}
return -1;
}

function boardingPass(theInput)
{
if (input ==1)
{
document.myform.textarea.value=("----------BOARDING PASS----------<br/>");
document.myform.textarea.value=("You are allocated in the First Class<br/>");
document.myform.textarea.value=("Your seat number is "+ element+"<br/>");
document.myform.textarea.value=("-----------------------------------------<br/>");
seats[element]= 1;
firstCount++;
}
else if (input ==2)
{
document.myform.textarea.value=("----------BOARDING PASS----------<br/>");
document.myform.textarea.value=("You are allocated in the Economy Class<br/>");
document.myform.textarea.value=("Your seat number is "+ element +"<br/>");
document.myform.textarea.value=("-----------------------------------------<br/>");
seats[element]= 1;
economyCount++;
}
}
function secondQuestion(theArray)
{
if (input == 1)
{
for (var n=6; n<11 ;n++)
{
if (theArray [n] == 0)
{
secondInput = document.myform.textarea.value=("Do you want to move to Economy Class? (If YES, please press 1. If NO, please press 2)","0");
if ( secondInput == 1)
{

input = 2;
element=linearSearch(seats);
document.myform.textarea.value=("You have been allocated to Economy Class<br/>");
boardingPass(input);
break;
}
else if (secondInput == 2)
{
document.myform.textarea.value=("Next flight leaves in 3 hours<br/>");
break;
}}}}
else if (input == 2)
{
for (var n=0; n<6 ;n++)
{
if (theArray [n] == 0)
{
secondInput = document.myform.textarea.value=("Do you want to move to First Class? (If YES, please press 1. If NO, please press 2)","0");
if ( secondInput == 1)
{
input = 1;
element=linearSearch(seats);
document.myform.textarea.value=("You have been allocated to First Class<br/>");
boardingPass(input);
break;
}
else if (secondInput == 2)
{
document.myform.textarea.value=("Next flight leaves in 3 hours<br/>");
break;
}}}}}
//-->
</script>
</head>
</body>
</html>



well i got this far and it keeps kicking me out of the initial input loop, why?
Reputation Points: 10
Solved Threads: 0
Newbie Poster
collegestudent is offline Offline
2 posts
since Nov 2008
Permalink
Nov 21st, 2008
0

Re: Converting document.writeln output to textarea box

Click to Expand / Collapse  Quote originally posted by collegestudent ...
<?xml version = "1.0"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns = "http://www.w3.org/1999/xhtml">

<head>
<title>Airline Reservation System</title>

<form id="ourForm" name="myform" >
<table>
<tr><td>Enter 1 for Economy Seat, 2 for First Class</td><td><input type="text" name="box1" size="5"/></td></tr>
<tr><td>Result</td><td><textarea name = "textarea" rows="40" cols="70"/></textarea></td></tr>
<tr><td><input type="button" value="Submit" name="button1"onClick="startArray()"></td>
<td><input type="reset" value="Clear" name="button2"></td></tr></table>
</FORM>
<HEAD>

<script type = "text/javascript">
<!--
var input;
var secondInput;
var element;
var secondElement;
var firstCount = 0;
var economyCount = 0;
var seats = [ ,0,0,0,0,0,0,0,0,0,0]; //allocate 10-element Array

function startArray()
{

formRef = document.getElementById;
input = document.myform.box1.value;
formRef.box1.value="";

for(var i=0; i<11; i++)
{
if (input == 1 || input = 2)
{
element = linearSearch(seats);
if (element == -1 && input == 1)
{
document.myform.textarea.value=("The First Class is already fully booked\n");
secondQuestion(seats);
}
else if (element == -1 && input == 2)
{
document.myform.textarea.value=("The Economy Class is already fully booked\n");
secondQuestion(seats);
}
else
boardingPass(input);
}
//to terminate the program
else
{
document.myform.textarea.value=("Bye-bye!");
System.exit(0);
}}}

function linearSearch(theArray)
{
if (input == 1)
{
for (var n=0; n<6 ; n++)
if (theArray [n] == 0)
return n;
}
else if (input == 2)
{
for (var n=6; n<11 ; n++)
if (theArray [n] == 0)
return n;
}
return -1;
}

function boardingPass(theInput)
{
if (input ==1)
{
document.myform.textarea.value=("----------BOARDING PASS----------<br/>");
document.myform.textarea.value=("You are allocated in the First Class<br/>");
document.myform.textarea.value=("Your seat number is "+ element+"<br/>");
document.myform.textarea.value=("-----------------------------------------<br/>");
seats[element]= 1;
firstCount++;
}
else if (input ==2)
{
document.myform.textarea.value=("----------BOARDING PASS----------<br/>");
document.myform.textarea.value=("You are allocated in the Economy Class<br/>");
document.myform.textarea.value=("Your seat number is "+ element +"<br/>");
document.myform.textarea.value=("-----------------------------------------<br/>");
seats[element]= 1;
economyCount++;
}
}
function secondQuestion(theArray)
{
if (input == 1)
{
for (var n=6; n<11 ;n++)
{
if (theArray [n] == 0)
{
secondInput = document.myform.textarea.value=("Do you want to move to Economy Class? (If YES, please press 1. If NO, please press 2)","0");
if ( secondInput == 1)
{

input = 2;
element=linearSearch(seats);
document.myform.textarea.value=("You have been allocated to Economy Class<br/>");
boardingPass(input);
break;
}
else if (secondInput == 2)
{
document.myform.textarea.value=("Next flight leaves in 3 hours<br/>");
break;
}}}}
else if (input == 2)
{
for (var n=0; n<6 ;n++)
{
if (theArray [n] == 0)
{
secondInput = document.myform.textarea.value=("Do you want to move to First Class? (If YES, please press 1. If NO, please press 2)","0");
if ( secondInput == 1)
{
input = 1;
element=linearSearch(seats);
document.myform.textarea.value=("You have been allocated to First Class<br/>");
boardingPass(input);
break;
}
else if (secondInput == 2)
{
document.myform.textarea.value=("Next flight leaves in 3 hours<br/>");
break;
}}}}}
//-->
</script>
</head>
</body>
</html>



well i got this far and it keeps kicking me out of the initial input loop, why?
You have assigned the value "2" to variable input... 
if (input == 1 || input = 2)

you should have only checked it
if (input == 1 || input == 2)
Reputation Points: 10
Solved Threads: 3
Newbie Poster
sasankasekhar is offline Offline
24 posts
since Jan 2007

This thread is more than three months old

No one has posted to this discussion for at least three months. Please let old threads die and do not reply to them unless you feel you have something new and valuable to contribute that absolutely must be added to make the discussion complete. Otherwise, please start a new thread in this forum instead.
Message:
Previous Thread in JavaScript / DHTML / AJAX Forum Timeline: getting values of non-standard attributes
Next Thread in JavaScript / DHTML / AJAX Forum Timeline: Checkbox Help





About Us | Contact Us | Advertise | Acceptable Use Policy
Forum Index | Build Custom RSS Feed


Follow us on Twitter


© 2011 DaniWeb® LLC