nicEdit and onchange

Discussion in 'Javascript' started by Fergus McMenemie, Jun 16, 2009.

  1. Hi,

    I have used the nicEditor (from http://nicedit.com/) within a
    page to convert a textarea into a rich text editor. Works OK.
    However the onchange event I had tied to the textarea no longer
    works.

    I was wondering if anybody knew what I could do to get this
    functionality back.

    ======Here is a snip of example code========

    !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <title>title</title>
    <script language="JavaScript" src="/utils/jslib/jquery-1.2.6.min.js"
    type="text/javascript"></script>
    <script language="JavaScript" src="/utils/jslib/nicEdit/nicEdit.js"
    type="text/javascript"></script>
    <script language="JavaScript" type="text/javascript">
    bkLib.onDomLoaded(nicEditors.allTextAreas);</script>
    <script language="JavaScript" type="text/javascript">
    function enubmit(name) {
    unsaved_changes=true;
    alert(name +" has changed\n");
    }
    </script>
    </head>

    <body>
    <form id="guest_detail_form" onSubmit="return false;">

    <input type="text" name="surname" onchange="enubmit('surname');" />
    <!-- lots and lots of snipped stuff -->
    <br />
    <textarea name="email" id="comment" onchange="enubmit('comment');">
    hello world</textarea>
    </form>
    </body>
     
    Fergus McMenemie, Jun 16, 2009
    #1
    1. Advertisements

  2. "Doesn't work" is a useless error description. Doesn't work *how* (error
    message), *where* (runtime environment), *when* (preconditions of failure)?
    The first line must start with a `<' for a proper declaration.
    ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
    Most certainly that's one reason. jQuery is junk, and jQuery before 1.3
    is even more junk. Search the archives.
    You don't expect anyone to wade through this *for* *free*, do you?
    Neither `script' element requires the deprecated `language' attribute.
    ^^^^^^^^^^^^^^^
    I presume that identifier is declared somewhere above?
    Not Valid. But you don't appear to need a form here anyway.
    ^
    Unwise. This is *HTML*, remember?
    .... that may still be relevant. But fix your markup first.
    Again, it's declared *HTML*, not XHTML.

    PointedEars
     
    Thomas 'PointedEars' Lahn, Jun 16, 2009
    #2
    1. Advertisements

  3. Boy-oh-boy did you have fun with that! I guess you are making the
    most of FAQ point about neccessary rudeness:)

    I include another version of the code which has been adjusted to
    take account of your points. My question is basically how do I
    provide rich text editing functionality within a HTML form? Having
    traweled the web I ended up with nicEdit, which works OK. It is
    just that I have lost the ability to detect changes to the textarea.

    I was wondering if anybody had ideas on how I might get it back.
    The example code does nothing, by which I mean enubmit() is not called
    for changes to the textarea. I was hoping somebody on this list
    would have experience with nicEdit and have sorted what I consider
    to be a common issue. I am using firefox 3.0.10

    I am also keen to hear about any alternatives to nicEdit.

    PS> I have attempted to post this to the nicEdit forums but cant
    get them to work.

    ======Here is a snip of example code========
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <title>title</title>
    <script type="text/javascript" src="/utils/jslib/nicEdit/nicEdit.js">
    </script>
    <script type="text/javascript">
    bkLib.onDomLoaded(nicEditors.allTextAreas);</script>
    <script type="text/javascript">
    function enubmit(name) { alert(name +" has changed\n"); } </script>
    </head>
    <body>
    <form id="guest_detail_form" onSubmit="return false;" >
    <input size="40" type="text" name="surname" id="surname"
    onchange="enubmit('surname');">
    <!-- lots and lots of snipped stuff -->
    <br>
    <textarea rows="15" cols="100" name="email" id="comment"
    onchange="enubmit('comment');">
    hello

    world
    </textarea>
    </form>
    </body>
     
    Fergus McMenemie, Jun 18, 2009
    #3
  4. No. You should read the FAQ for a change, especially
    <http://www.jibbering.com/faq/faq_notes/clj_posts.html#ps1DontWork>

    Please don't come back until then.


    Score adjusted

    PointedEars
     
    Thomas 'PointedEars' Lahn, Jun 18, 2009
    #4
  5. I had read the FAQ, it was rather good and I learnt a lot.

    But I guess I will have to give up on nicEdit, or perhaps perform
    my own before/after comparison of the textarea to see if it has
    changed.

    Bye-bye.
     
    Fergus McMenemie, Jun 18, 2009
    #5
  6. Fergus McMenemie

    Tim Down Guest


    I would imagine you're getting no notifications of the textarea's
    value changing because it isn't changing. I don't know nicEdit but if
    it's anything like most JavaScript-based rich text editors for the web
    then it will be replacing or hiding the textarea in the document, and
    the content that the user edits is inside an iframe. The editor itself
    may or may not have some functionality your code can use to be
    notified that the editor's content has changed - you'll need to check
    the documentation.

    Tim
     
    Tim Down, Jun 18, 2009
    #6
  7. Thanks for the reply.

    Agreed. The nicEditor docs state that the contents of it's panel
    and the associated textarea as synchronised onsubmit. However I
    need it before then, there is not much more written on the issue.
    I am having bother posting to the nicEditor forum and only posted
    here on the off chance that somebody else had run into the same
    issue.

    Thanks Fergus.
     
    Fergus McMenemie, Jun 22, 2009
    #7
  8. Fergus McMenemie

    arctirux

    Joined:
    Jan 20, 2014
    Messages:
    1
    Likes Received:
    0
    Hey, I was having the same problem with nicEdit but managed to fix it. As for my case I wanted to be able to copy that content into another DIV.

    function COPY_STRING_TO_HTML(SOURCE, DIV) {
    $(DIV).fadeOut(1000).html($(SOURCE).html()).fadeIn(1000);
    }

    $(document).ready(function() {

    $( "#doapreview" ).mousemove(function() { COPY_STRING_TO_HTML('.nicEdit-main','#elementpreview1'); });

    )}

    DO NOT FORGET, THE NAME OF THE DIV THAT CONTAINS THE TEXT IS .nicEdit-main AND NOT YOUR TEXTAREA CLASS

    I have used it on my form like this techlab.co.ke/?Page=Blog&Create_Post=1&Title=Guest%20Post
     
    arctirux, Jan 20, 2014
    #8
    1. Advertisements

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments (here). After that, you can post your question and our members will help you out.