textarea and link

[liguehs]

Hi guys,
OK so here is my problem.
What I want to do is that, everytime a user clicks on a link, the value of the link gets inserted in a textarea. When the user clicks on another link, that value is on another line.
For exemple there is 3 links:
Link 1 , Link 2 , Link 3
And the users clicks on link 1 and link 3. So the texarea must show:
Link 1,
Link 3,
And if a user wants to take out a value, they have to right click on it.
For exemple, I would like to take out Link 3, so I right click link 3 in the textarea, and it doesnt show.
So far, I am able to insert the values in the textarea, but not in different lines...
It shows Link1,Link3...
Here is the Javascript Code:

<script language="javascript" type="text/javascript">
function addtext(text) {
    document.players.players1.value += text+",";
}
</script>

And here is where the links are, which is pullen using DB:

echo"<table border='1' width='100%'>
    <tr>
        <td>
            <table width='100%'>
                <tr>
                    <th colspan='6' bgcolor='#444444'><font color='#FFFFFF'>$user_team</font></th>
                </tr>";
                $result = mysql_query("SELECT * FROM `playersratings`  WHERE `Team` ='$ProId' OR `Team` = '$FarmId' ",$link);
                while($row = mysql_fetch_array($result))
        {
        $name = "" .$row['Name']. "";
        echo "<tr><td><a href='#' onclick=\"addtext('$name')\"\>$name</a></td></tr>";
        }
?>

And here is the textarea code:

<textarea name='players1' COLS="20" ROWS="10" type="text"></textarea>

Thanks for your help,
Ara

 

[descalzo]

Step 1. You have to capture the right click on the link by adding a "oncontextmenu" handler for the link.

echo "<tr><td><a href='#' onclick=\"addtext('$name')\"      
       oncontextmenu=\"removetext('$name')"\>$name</a></td></tr>";

Step 2. You have to define removetext( txt ) so that it removes the text from the text area.
a) pull text from text area
b) find first occurance of url
c) find substrings in front and behind, and join them
d) put resulting text into text area

<script language="javascript" type="text/javascript">
function removetext(txt) {
 
    orig_text = document.players.players1.value
    startAt = orig_text.search(txt );
    txt_len = txt.length ;
    new_text = orig_text.substring( 0, startAt - 1 ) + 
                       orig_text.substring( startAt + txt_len ) ;
 
   document.players.players1.value = new_text ;
}
 
</script)

Might be one-off on and does not include error checking (ie if you right click on a url that is not in text area. Also, does not remove multiple occurances of a url.

 

[liguehs]

Thanks alot, but :

+",/n";

How to remove it with it?
Edit:
And is it possible to restrain the user from adding only once the same value?

 

[descalzo]

+",/n";

How to remove it with it?

Sorry if this comes across a bit pedantic.

I showed you how to remove the url. You want to adjust the script so that it will remove ",\n". Well, just add ",\n" to the text passed to the script.

<script language="javascript" type="text/javascript">
function removetext(txt) {
    [B]txt = txt + ",\n" ;[/B]
    orig_text = document.players.players1.value
    [B]startAt[/B] = orig_text.[B]search[/B](txt );
    txt_len = txt.length ;
    new_text = orig_text.substring( 0, startAt - 1 ) + 
                       orig_text.substring( startAt + txt_len ) ;
   document.players.players1.value = new_text ;
}
</script>

And is it possible to restrain the user from adding only once the same value?

If you notice, I used the "search" function on the text from the text area to find the url you want to remove. It gives the position where the url starts (I stored that value in "startAt"). If it is not found, "search" returns -1.

So, what you have to do is rewrite your addtext(text) function to search for text (the parameter) in document.players.players1.value + ",\n" If the search returns -1, you add the url. If the search returns anything else, you do not.

 

[liguehs]

Oh right sorry,

I guess I was still sleepy a bit earlier.

Thanks again.
Ara
Edit:
I kinda of a problem with the code and I cant put my finger on it...

Well, ok so I click on the link and it gets inserted in the text area, and I right click and it goes away.....

But, when I add a 2 links and I right click on one, only some of the words dissapears...

Also I was wondering, would it be possible to right click on the text area to make it disapear?

 

[descalzo]

Also I was wondering, would it be possible to right click on the text area to make it disapear?

Assume you want the entire textarea widget to disappear (just hidden, not removed).

Right clicks are caught by "oncontextmenu", as the above code.

<textarea name='players1'  [B]oncontextmenu="hideMe()"[/B] COLS="20" ROWS="10" type="text"></textarea>

To hide or show objects, you adjust the .style.display property to "none" (to hide) or "" (to show).

    function hideMe(){
     document.getElementById("players1").style.display = "none"
    }

To make it re-appear when he right clicks on a link and you add the url to the text area, add this line to the addtext function:

document.getElementById("players1").style.display = ""

 

[liguehs]

No, not the whole textarea, just the value he right clicks on...
Is it possible? I doubt it...

and also:

I kinda of a problem with the code and I cant put my finger on it...

Well, ok so I click on the link and it gets inserted in the text area, and I right click and it goes away.....

But, when I add a 2 links and I right click on one, only some of the words dissapears...

 

[descalzo]

RE: making line of text in textarea disappear when right clicked

Cannot think of a way to do it.

RE: leaving some text when two lines in textarea

Maybe if you post your new code and/or link to the page that uses them

 

[liguehs]

I cant give you the link as this part is a restriced area for the members, and I cant mess up with the system..

But here is the code

<script language="javascript" type="text/javascript">
function addtext(text) {
orig_text = document.players.players1.value
startAt = orig_text.search(text);
if (startAt = "-1")
{
  document.players.players1.value += text+",\n";
  }


}

function removetext(txt) {
    txt = txt + ",\n" ;
    orig_text = document.players.players1.value
    startAt = orig_text.search(txt );
    txt_len = txt.length ;
    new_text = orig_text.substring( 0, startAt - 1 ) +
                       orig_text.substring( startAt + txt_len ) ;
   document.players.players1.value = new_text ;
}

</script>

And the link

echo "<tr><td><a href='#' onclick=\"addtext('$name')\" oncontextmenu=\"removetext('$name')\">$name</a></td></tr

Thanks again for your help,
Ara

 

[descalzo]

function addtext(text) {
orig_text = document.getElementById("players1").value
startAt = orig_text.search(text);
if ([B]startAt ==  -1[/B])
{
  document.getElementById("players1").value += text+",\n";
  }
}
function removetext(txt) {
    txt = [B]txt + ","[/B] ;
    orig_text = document.getElementById("players1").value 
    startAt = orig_text.search(txt );
    txt_len = txt.length ;
  [B] new_text = orig_text[/B] ;
 
  [B]if( startAt > -1 ){[/B]
[B]   if( startAt > 0 ){[/B]
[B]       new_text = orig_text.substring( 0, startAt - 1 ) +[/B]
[B]                      orig_text.substring( startAt + txt_len + 1 ) ;[/B]
[B]   } else {[/B]
 
[B]      new_text = orig_text.substring( txt_len + 2 ) ;[/B]
[B]   }[/B]
[B]  }[/B]
 
    document.getElementById("players1").value  = new_text ;
}

Note that you test for equality with '==' in javascript, not '='
And you test against the number -1, not the string "-1"

Tested on a mock-up page and works. Had to split into two cases, when it is the first item (ie startAt is 0, so that the first substring and other cases.

 

[liguehs]

1)
Thanks for fixing up my code, I was wondering why it was not working... And the worst is in PHP it's also == -.-

2) Ahh... Ok, Yeah I get what you mean

Thanks for your help,
Ara
Edit:
I have one other question.

Is it possible to disable the menu that appears when users right click? Because it is pretty annoying to have the right click menu...

 

[descalzo]

Is it possible to disable the menu that appears when users right click? Because it is pretty annoying to have the right click menu...

When you want to disable the default behavior of an element (button, link, etc) you add an event handler (onclick, oncontextmenu, etc) that returns the value of false . So

echo "<tr><td><a href='#' onclick=\"addtext('$name')[B] ; return false;[/B] \"      
       oncontextmenu=\"removetext('$name')[B] ; return false;[/B]"\>$name</a></td></tr>";

I added it to the onclick handler too, which disables the link (ie, if you had href='/index.html' , the link would not be followed).

 

[liguehs]

Thanks alot!!!