An append button: Text from Textarea to issues

(2 Pages)
1
2
→

27 Replies - 910 Views - Last Post: 10 February 2013 - 08:47 PM

#1 Eadmanday

New D.I.C Head

Reputation: 2

Posts: 49
Joined: 23-October 12

An append button: Text from Textarea to issues

Posted 04 February 2013 - 06:40 PM

Ok so i am really lost on this and i cant seem to even get my code off the ground...... i nuked this and tried again but still nothing. so here is the question.

1)Write a web page which has a textarea, a checkbox, and a button. When the user clicks the button checkbox is unchecked whatever text is in the text area is appended to the page as a new paragraph element. If the user clicks the button and the checkbox is checked the current output on the page is cleared and the contents of the text area replace whatever was there. Focus should be given to the text area when the page is loaded and restored after the button is clicked. Label the controls appropriately. Format the page using CSS.

i am having issues with this even getting the .value from the textarea. So i must be missing something here. I am not the best at this and any info would help.

Javascript

window.onload = function()  { 
document.getElementById("paste").onclick = function click() {

     var TypedText = document.getElementById('box1').value;
	 var paragraph = ""
	 var append = document.getElementById('form1').append;
	 	 
	 var getInfo = document.getElementById('ParaWrite');
	 
	 if (append.checked === true)
		 paragraph += "<p>"TypedText"</P>";
	 else
	paragraph == TypedText;


   getInfo.innterHTML = paragraph;
  }    
}

HTML

<!doctype html>
<html>
<head>
  <meta charset="utf-8">

  <title>TeXt BoX</title>
  
 
  <link rel="stylesheet" href="../css/normalize.css">
  <link rel="stylesheet" href="Textbox.css">
  
  
</head>
<script type="text/javascript" src="TextParatest.js"></script>
<body>
<h1></h1>
<form name="form1" id="form1">

<input type='checkbox' name='write' id='write' value='Check' />

<label for='write'>Append Paragraph</label><br/>

<textarea type="text" id="box"/></textarea>

<input type='button' value="Paste typed text" id='Paste'/>

</form>
<p id="lame"></p>



</body>
</html>

Look for your reply

Is This A Good Question/Topic? 0

Replies To: An append button: Text from Textarea to issues

#2 andrewsw

Provides a RESTful service

Reputation: 1049

Posts: 3,304
Joined: 12-December 12

Re: An append button: Text from Textarea to issues

Posted 04 February 2013 - 06:48 PM

The first thing that you must be fully aware of is that Javascript is case-sensitive.

You are referring to elements with ids of, for example, 'box1' and 'ParaWrite' that don't exist, and you are making-up an append method.

There are other things but I stopped looking.

Was This Post Helpful? 0

#3 Eadmanday

New D.I.C Head

Reputation: 2

Posts: 49
Joined: 23-October 12

Re: An append button: Text from Textarea to issues

Posted 04 February 2013 - 06:57 PM

Sorry i was messing around with ID's and forgot to change it back
on line 11 i get a Unexpected identifier ??

window.onload = function()  { 
document.getElementById("paste").onclick = function click() {

     var TypedText = document.getElementById('box').value;
	 var paragraph = "";
	 var x = document.getElementById("form1");
	 	 
	 var getInfo = document.getElementById('ParaWrite');
	 
	 if (x.checked === true)
		 paragraph =+ "<p>"TypedText"</P>";
	 else
	paragraph == TypedText;


   getInfo.innterHTML = paragraph;
  }    
}

HTML

<!doctype html>
<html>
<head>
  <meta charset="utf-8">

  <title>TeXt BoX</title>
  
 
  <link rel="stylesheet" href="../css/normalize.css">
  <link rel="stylesheet" href="Textbox.css">
  
  
</head>
<script type="text/javascript" src="TextPara.js"></script>
<body>
<h1></h1>
<form name="form1" id="form1">

<input type='checkbox' name='write' id='write' value='Check' />

<label for='write'>Append Paragraph</label><br/>

<textarea type="text" id="box"/></textarea>

<input type='button' value="Paste typed text" id='Paste'/>

</form>
<p id="ParaWrite"></p>



</body>
</html>

This post has been edited by Eadmanday: 04 February 2013 - 07:00 PM

Was This Post Helpful? 0

#4 Dormilich

痛覚残留

Reputation: 2888

Posts: 7,533
Joined: 08-June 10

Re: An append button: Text from Textarea to issues

Posted 04 February 2013 - 07:36 PM

yupp, line #11 is all wrong.

paragraph =+ "<p>"TypedText"</P>";
// vs.
paragraph += "<P>" + TypedText + "</P>";

Was This Post Helpful? 0

#5 Eadmanday

New D.I.C Head

Reputation: 2

Posts: 49
Joined: 23-October 12

Re: An append button: Text from Textarea to issues

Posted 04 February 2013 - 07:42 PM

lol. that part makes me feel new to JS.

Now i got a null for the onclick method.

Was This Post Helpful? 0

#6 Dormilich

痛覚残留

Reputation: 2888

Posts: 7,533
Joined: 08-June 10

Re: An append button: Text from Textarea to issues

Posted 04 February 2013 - 07:47 PM

Eadmanday, on 05 February 2013 - 03:42 AM, said:

Now i got a null for the onclick method.

of course, you never set the paragraph variable. (but before you point to line #11, I point out that <form>s are never checked (line #6 vs. #10), only checkboxes and radio buttons are)

and before I forget it, line #13 is a comparison, not an assignment.

This post has been edited by Dormilich: 04 February 2013 - 07:48 PM

Was This Post Helpful? 0

#7 Eadmanday

New D.I.C Head

Reputation: 2

Posts: 49
Joined: 23-October 12

Re: An append button: Text from Textarea to issues

Posted 04 February 2013 - 08:01 PM

I thought that

paragraph = "";

would equal a string and therefor i could call it in for text at the bottom?

so i changed it to get rid of one line of code because i was having paragrapg === textType so i made it

 indow.onload = function()  { 
document.getElementById('paste').onclick = function() {


var paragraph = document.getElementById('box').value;
var x = document.getElementById("write");
var getInfo = document.getElementById('ParaWrite');
	 
	 if (x.checked === true)
		 paragraph =+ "<p>"+paragraph+"</P>";
	 else
	getInfo.innterHTML === paragraph;
	
  }    
}

I still get onclick is null. in crome.

This post has been edited by Eadmanday: 04 February 2013 - 08:06 PM

Was This Post Helpful? 0

#8 Dormilich

痛覚残留

Reputation: 2888

Posts: 7,533
Joined: 08-June 10

Re: An append button: Text from Textarea to issues

Posted 04 February 2013 - 09:13 PM

first, what operator is =+ supposed to be?

second, doing a comparison with innerHTML doesn’t write something to the element. and if the checkbox is checked, what do you do with the variable?

Was This Post Helpful? 0

#9 Eadmanday

New D.I.C Head

Reputation: 2

Posts: 49
Joined: 23-October 12

Re: An append button: Text from Textarea to issues

Posted 04 February 2013 - 09:22 PM

the =+ should be the increment operator. now i will look up if it is += or =+.

the

 	 if (x.checked === true)
		 paragraph =+ "<p>"+paragraph+"</P>";

checks to see if the box is checked. if true it will have paragraph equal a new so if it is checked it would append it. so i don't understand what you are referring to the variable?

Was This Post Helpful? 0

#10 Dormilich

痛覚残留

Reputation: 2888

Posts: 7,533
Joined: 08-June 10

Re: An append button: Text from Textarea to issues

Posted 04 February 2013 - 09:25 PM

and what happens when you executed that statement (i.e. when the checkbox was checked)?

PS. it’s +=

Was This Post Helpful? 1

#11 Eadmanday

New D.I.C Head

Reputation: 2

Posts: 49
Joined: 23-October 12

Re: An append button: Text from Textarea to issues

Posted 04 February 2013 - 09:28 PM

Nothing is happening when the box is checked or unchecked. i fixed the syntax error. thanks. I don't seem to get anything to write to the tag. any ideas?

This post has been edited by Eadmanday: 04 February 2013 - 09:29 PM

Was This Post Helpful? 0

#12 Dormilich

痛覚残留

Reputation: 2888

Posts: 7,533
Joined: 08-June 10

Re: An append button: Text from Textarea to issues

Posted 04 February 2013 - 09:30 PM

let me put it this way: if the checkbox is checked, then you don’t write the content and if the checkbox ain’t checked the content is written, though the content is empty at the same time.

Was This Post Helpful? 1

#13 Eadmanday

New D.I.C Head

Reputation: 2

Posts: 49
Joined: 23-October 12

Re: An append button: Text from Textarea to issues

Posted 04 February 2013 - 09:41 PM

so. i want to try and make figure this out step my step.
if i enter the text in the text area it stays there.
When i click the button JS grabs the ID "box".value
it then checks to see if the check box is checked.
If yes. then it adds another with the value of box (append)

if no (else)

the existing is the value of box.

i dont think that the content is empty because i type it in? would i need something like createTextNode() ?

document.write(getInfo.innterHTML === paragraph); and the box is checked it changes the screen to the words false.

This post has been edited by Eadmanday: 04 February 2013 - 09:45 PM

Was This Post Helpful? 0

#14 Dormilich

痛覚残留

Reputation: 2888

Posts: 7,533
Joined: 08-June 10

Re: An append button: Text from Textarea to issues

Posted 04 February 2013 - 09:53 PM

Eadmanday, on 05 February 2013 - 05:41 AM, said:

document.write(getInfo.innterHTML === paragraph); and the box is checked it changes the screen to the words false.

isn’t that obvious?

Was This Post Helpful? 1

#15 Eadmanday

New D.I.C Head

Reputation: 2

Posts: 49
Joined: 23-October 12

Re: An append button: Text from Textarea to issues

Posted 04 February 2013 - 09:57 PM

Ok. so this is slowly starting to make scene to me, And i thank you for your help.

so if i use document.write it takes away all my CSS and just throws the words onto white background. I was thinking that the Innter.HTML would append or replace the info in the p-tags?

Was This Post Helpful? 0

(2 Pages)
1
2
→

27 Replies - 910 Views - Last Post: 10 February 2013 - 08:47 PM

An append button: Text from Textarea to <p> issues

Replies To: An append button: Text from Textarea to <p> issues

Re: An append button: Text from Textarea to <p> issues

Re: An append button: Text from Textarea to <p> issues

Re: An append button: Text from Textarea to <p> issues

Re: An append button: Text from Textarea to <p> issues

Re: An append button: Text from Textarea to <p> issues

Re: An append button: Text from Textarea to <p> issues

Re: An append button: Text from Textarea to <p> issues

Re: An append button: Text from Textarea to <p> issues

Re: An append button: Text from Textarea to <p> issues

Re: An append button: Text from Textarea to <p> issues

Re: An append button: Text from Textarea to <p> issues

Re: An append button: Text from Textarea to <p> issues

Re: An append button: Text from Textarea to <p> issues

Re: An append button: Text from Textarea to <p> issues

Follow & Share

Give It A Try!

Programming

Web Development

Reference Sheets

Bye Bye Ads

Monthly Drawing