Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    Regular Coder
    Join Date
    Jul 2007
    Posts
    191
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Append/Replace Text in Textarea Onclick Question

    Hi the script at the bottom appends a text area with info onclick (ref:http://www.codingforums.com/javascript-programming/171514-toggle-text-textarea.html#post838162).

    I wanted to know if it's possible to have a function (possible within the existing one?) that replaces text as well.

    Something like this format would be perfect for what I'm tring to do:

    Code:
    <a href="#" onclick = "check('Replace this text', 'With this in the textarea')">Click Me to replace</a><br/>
    Original Code:

    Code:
    <!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>
    <meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
    <title>Onclick Textarea</title>
    
    <script type="text/javascript">
    function check(txt) {
    var obj=document.form1.textarea1;
    if(obj.value.search(txt)==-1) {
    obj.value+=txt + "\n";
    }
    else {
    if (txt !='This is some more text which cannot be deleted ') {
    obj.value=obj.value.replace(txt,"");
    obj.value=obj.value.replace(/\.*(\r|\n)+/g,"\n")
    }
    }
    
    }
    </script>
    
    </head>
    
    <body>
    <form name="form1">
    <textarea rows="10" cols="40" name="textarea1"></textarea>
    <br/><br/>
    
    <a href="#" onclick = "check('This is some long-winded text ')">Click Me 1</a><br/>
    <a href="#" onclick = "check('This is some more text which cannot be deleted ')">Click Me 2</a><br/>
    <a href="#" onclick = "check('This is yet more pointless text ')">Click Me 3</a>
    
    <!--
    <a href="javascript:check('This is some long-winded text ')">Click Me 1</a><br/>
    <a href="javascript:check('This is some more text which cannot be deleted ')">Click Me 2</a><br/>
    <a href="javascript:check('This is yet more pointless text ')">Click Me 3</a>
    -->
    
    </form>
    
    </body>
    </html>
    Thanks!

  • #2
    Senior Coder A1ien51's Avatar
    Join Date
    Jun 2002
    Location
    Between DC and Baltimore In a Cave
    Posts
    2,717
    Thanks
    1
    Thanked 94 Times in 88 Posts
    Basic idea:

    Code:
    function check(oldText,newText){
        newText = newText || "";
        var ta = document.form1.textarea1;
        if(ta.value.indexOf(oldText) === -1){
            ta.value += oldText + "\n";
        }
        else{
            ta.value = newText.replace(oldText,newText);
        }
    }
    Eric
    Tech Author [Ajax In Action, JavaScript: Visual Blueprint]

  • #3
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,919
    Thanks
    203
    Thanked 2,531 Times in 2,509 Posts
    I am not entirely clear, but is this what you want?

    Code:
    <html>
    <head>
    
    <script type="text/javascript">
    function check(txt, newTxt) {
    var obj=document.form1.textarea1;
    if(obj.value.search(txt)==-1) {
    obj.value+=txt + "\n";
    }
    else {
    if (txt !='This is some more text which cannot be deleted ') {
    obj.value=obj.value.replace(txt,newTxt);
    obj.value=obj.value.replace(/\.*(\r|\n)+/g,"\n")
    }
    }
    
    }
    </script>
    
    </head>
    
    <body>
    <form name="form1">
    <textarea rows="10" cols="40" name="textarea1"></textarea>
    <br/><br/>
    
    <a href="#" onclick = "check('This is some long-winded text ', 'Some Other Nonsensical Text')">Click Me 1</a><br/>
    <a href="#" onclick = "check('This is some more text which cannot be deleted ', '')">Click Me 2</a><br/>
    <a href="#" onclick = "check('This is yet more pointless text ', 'Yet More Incomprehensible Text')">Click Me 3</a>
    
    </body>
    </html>

  • #4
    Regular Coder
    Join Date
    Jul 2007
    Posts
    191
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Philip M View Post
    I am not entirely clear, but is this what you want?

    Code:
    <html>
    <head>
    
    <script type="text/javascript">
    function check(txt, newTxt) {
    var obj=document.form1.textarea1;
    if(obj.value.search(txt)==-1) {
    obj.value+=txt + "\n";
    }
    else {
    if (txt !='This is some more text which cannot be deleted ') {
    obj.value=obj.value.replace(txt,newTxt);
    obj.value=obj.value.replace(/\.*(\r|\n)+/g,"\n")
    }
    }
    
    }
    </script>
    
    </head>
    
    <body>
    <form name="form1">
    <textarea rows="10" cols="40" name="textarea1"></textarea>
    <br/><br/>
    
    <a href="#" onclick = "check('This is some long-winded text ', 'Some Other Nonsensical Text')">Click Me 1</a><br/>
    <a href="#" onclick = "check('This is some more text which cannot be deleted ', '')">Click Me 2</a><br/>
    <a href="#" onclick = "check('This is yet more pointless text ', 'Yet More Incomprehensible Text')">Click Me 3</a>
    
    </body>
    </html>
    Yes that's exactly what I was trying to do. Thanks so much again Phillip!

    Thanks as well, Eric. Awesome.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •