dcsimg
www.webdeveloper.com
Results 1 to 8 of 8

Thread: Selection in textarea grabs tags

  1. #1
    Join Date
    Sep 2014
    Posts
    16

    Selection in textarea grabs tags

    I use a small JS HTML editor (not WYSIWYG) for my blog, It works fine except for one thing.

    If I want to select just a few characters and HTML tags are next to them, the tags get included in the selection, selecting text by itself is okay - or if a space is between a character (like a quote) and the tag bracket.

    The JS itself a very simple. There are functions for the buttons and that's about it. The buttons are fine, it's the cursor selection to change something that presents the situation.

    The only thing that seems generic for the textarea is:
    Code:
    var textarea;
    Which I guess is just declaring it and the button functions take from there.

    I am assuming that something can be included in it to solve the problem.

    I realize that this may be a bit vague, but I can't think of any other way to explain it.

    Thanks ahead for any help.

  2. #2
    Join Date
    Dec 2005
    Location
    FL
    Posts
    7,458
    Is this a question about a script (if yes, show it)
    or a question about how to use your editor?

    I'm unclear as to the requirements to solve your problem.

  3. #3
    Join Date
    Sep 2014
    Posts
    16
    Actually I gave you the code, but here's the rest.
    Code:
    var textarea;
    
    document.write("<link href=\"/msf/pmga.css\" rel=\"stylesheet\" type=\"text/css\">"); 
    function edToolbar(obj) {
    document.write("<img src=\"/msf/editor/bld.gif\" class=\"edb\" name=\"btnBold\" title=\"Bold\" onClick=\"doAddTags('<b>','</b>','" + obj + "')\">"); 
    document.write("<img src=\"/msf/editor/ita.gif\" class=\"edb\" name=\"btnItalic\" title=\"Italic\" onClick=\"doAddTags('<i>','</i>','" + obj + "')\">"); 
    document.write("<br>");
    } 
     
    function doAddTags(
    tag1,tag2,obj) {textarea = document.getElementById(obj);
    if (document.selection) { textarea.focus();  
    var sel = document.selection.createRange(); sel.text = tag1 + sel.text + tag2;} else {
    var len = textarea.value.length;  
    var start = textarea.selectionStart; 
    var end = textarea.selectionEnd;  
    var scrollTop = textarea.scrollTop; 
    var scrollLeft = textarea.scrollLeft; 
    var sel = textarea.value.substring(start, end); 
    var rep = tag1 + sel + tag2; textarea.value = textarea.value.substring(0,start) + rep + textarea.value.substring(end,len); textarea.scrollTop = scrollTop; textarea.scrollLeft = scrollLeft; 
    }
    }

  4. #4
    Join Date
    Sep 2014
    Posts
    16
    Just tried something and realized this is an IE problem (does not occur in Chrome etc). I use IE for blog work because I like it's spell checker (use Chrome for everything else).

    Code:
    if (document.selection) { textarea.focus();  
    var sel = document.selection.createRange(); sel.text = tag1 + sel.text + tag2;}
    Does it have to do with the textarea focus?

  5. #5
    Join Date
    Sep 2014
    Posts
    16
    Just tried something and realized this is an IE problem (does not occur in Chrome etc). I use IE for blog work because I like it's spell checker (use Chrome for everything else).

    Code:
    if (document.selection) { textarea.focus();  
    var sel = document.selection.createRange(); sel.text = tag1 + sel.text + tag2;}
    Does it have to do with the textarea focus? Only guessing

  6. #6
    Join Date
    Dec 2005
    Location
    FL
    Posts
    7,458

    Exclamation

    In you post #1, this is the only code I see visible...
    PHP Code:
    var textarea
    If that's all you can give us to work with, the answers may be just as terse.

    Quote Originally Posted by eejay View Post
    Actually I gave you the code, but here's the rest.
    Code:
    var textarea;
    
    document.write("<link href=\"/msf/pmga.css\" rel=\"stylesheet\" type=\"text/css\">"); 
    function edToolbar(obj) {
    document.write("<img src=\"/msf/editor/bld.gif\" class=\"edb\" name=\"btnBold\" title=\"Bold\" onClick=\"doAddTags('<b>','</b>','" + obj + "')\">"); 
    document.write("<img src=\"/msf/editor/ita.gif\" class=\"edb\" name=\"btnItalic\" title=\"Italic\" onClick=\"doAddTags('<i>','</i>','" + obj + "')\">"); 
    document.write("<br>");
    } 
     
    function doAddTags(
    tag1,tag2,obj) {textarea = document.getElementById(obj);
    if (document.selection) { textarea.focus();  
    var sel = document.selection.createRange(); sel.text = tag1 + sel.text + tag2;} else {
    var len = textarea.value.length;  
    var start = textarea.selectionStart; 
    var end = textarea.selectionEnd;  
    var scrollTop = textarea.scrollTop; 
    var scrollLeft = textarea.scrollLeft; 
    var sel = textarea.value.substring(start, end); 
    var rep = tag1 + sel + tag2; textarea.value = textarea.value.substring(0,start) + rep + textarea.value.substring(end,len); textarea.scrollTop = scrollTop; textarea.scrollLeft = scrollLeft; 
    }
    }

    Considering post #3, do you have a live link so that we don't need to re-create your code?
    What do the HTML elements look like? The CSS file? The .gif images referenced?

    It MAY be that you are using a variable name (textarea) that is the same as an HTML tag ( <textarea> )
    and it MAY be confusing IE in this case. Try not to use reserved words as variable names.

    It MAY be the use of the document.write() statement. It cannot be called upon after the page has been rendered
    without reloading the whole page as if starting over. Again difficulty to say as the code that callse
    this function is not defined in the snippet you have provided.

  7. #7
    Join Date
    Sep 2014
    Posts
    16
    Try this for terse
    1. The explanation I first gave was all that was needed (first bit of code was not), to provide the answer which has taken me days, extra phone calls and interrupting people in the middle of large coding projects to find out.
    2. It's apparently an html bug, not javascript. To be a so called "Super Moderator" you should have known that - turns out it is a very common probem.
    3. textarea is not a reserved word in Javacript (W3C) - you do not know what you are talking about.
    4. You are not going to be given all my code (JS, HTML Images or otherwise), you don't need it - I do not endorse code theft.
    5. I will never use this forum again.

    Don't bother giving some idiot reply to this - you've already made enough of a fool out of yourself.

  8. #8
    Join Date
    May 2006
    Location
    Somewhere behind your screen
    Posts
    1,686
    Quote Originally Posted by eejay View Post
    ...I will never use this forum again...
    do us a favor please

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles