nicEdit and onchange

F

Fergus McMenemie

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>
 
T

Thomas 'PointedEars' Lahn

Fergus said:
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.

"Doesn't work" is a useless error description. Doesn't work *how* (error
message), *where* (runtime environment), *when* (preconditions of failure)?
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">

The first line must start with a `<' for a proper declaration.
<html>
<head>
<title>title</title>
<script language="JavaScript" src="/utils/jslib/jquery-1.2.6.min.js"
type="text/javascript"></script>
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
Most certainly that's one reason. jQuery is junk, and jQuery before 1.3
is even more junk. Search the archives.
<script language="JavaScript" src="/utils/jslib/nicEdit/nicEdit.js"
type="text/javascript"></script>

You don't expect anyone to wade through this *for* *free*, do you?
<script language="JavaScript" type="text/javascript">
bkLib.onDomLoaded(nicEditors.allTextAreas);</script>
<script language="JavaScript" type="text/javascript">

Neither `script' element requires the deprecated `language' attribute.
function enubmit(name) {
unsaved_changes=true;
^^^^^^^^^^^^^^^
I presume that identifier is declared somewhere above?
alert(name +" has changed\n");
window.alert(...);

}
</script>
</head>

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

Not Valid. But you don't appear to need a form here anyway.
<input type="text" name="surname" onchange="enubmit('surname');" />
^
Unwise. This is *HTML*, remember?
<!-- lots and lots of snipped stuff -->

.... that may still be relevant. But fix your markup first.

Again, it's declared *HTML*, not XHTML.

<textarea name="email" id="comment" onchange="enubmit('comment');">
hello world</textarea>
</form>
</body>

PointedEars
 
F

Fergus McMenemie

Thomas 'PointedEars' Lahn said:
"Doesn't work" is a useless error description. Doesn't work *how* (error
message), *where* (runtime environment), *when* (preconditions of failure)?

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>
 
T

Tim Down

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>


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
 
F

Fergus McMenemie

Tim Down said:
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.

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.
 
Joined
Jan 20, 2014
Messages
1
Reaction score
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
 

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. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,744
Messages
2,569,483
Members
44,902
Latest member
Elena68X5

Latest Threads

Top