Javascript help i want to click a link and have text get copied into a textarea

turkman · July 12, 2010

i have a php forum and in the posts i have a link to quote the post... when clicked i want javascript to automatically update the textarea called quickreply at the bottom of the page by entering the quote into it.

also i want to be able to quote numerous people. So for example

if a thread has 10 replies ... you go to reply 1 and press quote it should input reply 1's content in the textarea at the bottom

if you then click quote on reply 3 for example it should keep reply 1's text there and on a newline put reply 3 's content.

all i know is in the links ill have to have something like onclick='quotePost(".$postcontent.")'

Then obviously ill have to have a quotepost javascript function that will get the text and display it in the textarea called quickreply.

Can someone show me how to code the quotepost function ?

turkman · July 12, 2010

ok this is what i have so far and it isnt working but i dont understand why.

firstly quote_cite.js

function quotePost( var post){

document.write("<h1>In quotePost </h1>" + post);

document.getElementById('message').value = document.getElementById('message').concat('>',post,'\r\n');

}

ok this is how i link to that script

<head>
<link rel="stylesheet" type="text/css" href="style/don3.css" />
<title> <?PHP echo getSetting("PAGE_TITLE") ; ?> </title>
<script type="text/javascript" src="scrips/quote_cite.js"></script> 
</head>

<body>

This is how im echoing out the contents in my php file


      <div class = 'postoptions'>
              <a href = '#'>Reference</a>
              <a href = '#'onclick = \"quotePost('".filter_text(nl2br(stripslashes($row['message'])))."')\">quote</a>
              <a href = '#'>Rage</a>
              </div>

this is how it displays in html

<div class = 'postoptions'> 
              <a href = '#'>Reference</a> 
              <a href = '#'onclick = "quotePost('i hope soooooo')">quote</a> 
              <a href = '#'>rage</a> 
              </div>

this is the textarea i want to update

echo "<br/>
      <table cellspacing = '0'>
          <form action = 'includes/back_process.php?replytothread=$id' method = 'POST' enctype='multipart/form-data'>
          
      
          <th class = 'label'>Quick Reply</th>
          <tr><td><input type = 'textbox' name = 'name' value = '$name'/>  Enter Name</td></tr>
          <tr><td><textarea  id = 'message' name = 'message' rows = '10' cols = '100'></textarea> </td></tr>
          <tr><td><input type = 'file'  name = 'image'></td></tr>";

When i click the quote button nothing happens... i was hoping it would appear in the textarea... do you see any probelms with it?

XeNoMoRpH1030 · July 12, 2010

One thing I'd consider at least is ditching your extra spaces.

For example, you have

<textarea  id = 'message' name = 'message' rows = '10' cols = '100'>

when it should be

<textarea  id='message' name='message' rows='10' cols='100'>

Starting with proper HTML will at least help narrow down the problem area.

turkman · July 12, 2010

i changed the function quotePost(var post)

to have a window.open("www.google.com");

at the top - just to see if the function actually gets called...however when i click the link nothing happens and no window gets opened which leads me to believe that the function never actually get called.

Does this help narrow it down?

turkman · July 12, 2010

Can nobody help me? I cant get javascript to work. Ive been trying all day.

Psycho · July 12, 2010

Here is a quick mock-up of one possible solution:

<html>
<head>
<style>
.post { background-color: #ccccff; }
.post_title { font-weight: bold; float: left; }
.quote_link { text-align: right; }
</style>

<script type="text/javascript">

function addQuote(postID)
{
    var replyObj = document.getElementById('reply');
    var quoteAuth = document.getElementById('post_'+postID+'_author').innerHTML;
    var quoteText = document.getElementById('post_'+postID+'_text').innerHTML;
    var replyContent = '[quote author='+quoteAuth+']'+quoteText+'[/quote]';
    replyObj.value += "\n" + replyContent;
    return false;
}
</script>
</head>

<body>

<div id="post_1" class="post">
<div id="post_1_header" class="post_title">Post By: <span id="post_1_author">Bob</span></div>
<div class="quote_link"><a href="#" onclick="return addQuote('1');">Quote</a></div>
<div id="post_1_text">Hey how many feet are in a mile?</div>
</div>
<br />
<div id="post_2" class="post">
<div id="post_2_header" class="post_title">Post By: <span id="post_2_author">Jane</span></div>
<div class="quote_link"><a href="#" onclick="return addQuote('2');">Quote</a></div>
<div id="post_2_text">There are 5,280 feet in a mile.</div>
</div>
<br />
<div id="post_3" class="post">
<div id="post_3_header" class="post_title">Post By: <span id="post_3_author">Bob</span></div>
<div class="quote_link"><a href="#" onclick="return addQuote('3');">Quote</a></div>
<div id="post_3_text">Great, thanks.</div>
</div>
<br />

Reply:<br />
<textarea name="reply" id="reply" style="width:600px; height:250px;"></textarea>

</body>
</html>

turkman · July 12, 2010

hey thanks for the reply... im confused though as im very new to javascript and thats not how i laid out my info...

you went into good details there... but what i have basically discovered is that when i echo out the javascript to call the function, even when i click the link... the function never gets called... i tested it by adding an alert("in addquote"); to the quotePost() function... but this never displays.

Also i have the content stored in a php variable... which i want to pass to the quotePost directly... as it will save me having to do that innerhtml stuff.

i just cant work out why the quotePost never gets called... yet when i change quotePost to alert('working') i get a alert box popup.

is it how im echoing out the code or am i calling the external file wrong?

turkman · July 12, 2010

ive changed my code to make it simplier but still it doesnt seem like quotePost ever gets called

<script type="text/javascript">

function quotePost( var post){

alert("In Function");

var reply_sting = ">" + post + "\n";
document.getElementById('message').value += reply_string;



}

then in the php file

<a href = \"javascript:quotePost('Working')\">quote2</a>

which displays like this in html

<a href = "javascript:quotePost('Working')">quote2</a>

Psycho · July 12, 2010

Change this

function quotePost( var post){

To this

function quotePost(post){

turkman · July 12, 2010

ok this is a start... now it reaches the function because the alert box shows up... however the textarea's value does not change.

So its in the function, This part doesnt work

var reply_sting = ">" + post + "\n";

document.getElementById('message').value += reply_string;

is this because its a textarea i know setting a value in a textarea is different from say a textbox

turkman · July 12, 2010

quick note

function quotePost(post){
alert(post);
var reply_sting = ">" + post + "\n";
alert(reply_string);
document.getElementById('message').value += reply_string;

}

if i pass the value working, the alert box pops up saying working...

however the second alert box doesn't show... so i assume the code breaks down when im assigning the reply_string variable?

turkman · July 12, 2010

never mind i spelt it wrong.. got it working now. Thanks for your help

Sign In

Javascript help i want to click a link and have text get copied into a textarea

Recommended Posts

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Join the conversation

Important Information