You are not logged in Log in Join
You are here: Home » Members » Kedai's space at zope.org » WYSIWYG TextAreaEditor for > ie4.x » TextAreaEditor for ie4.x + » View File

Log in
Name

Password

 

TextAreaEditor for ie4.x +

File details
Size
3 K
File type
text/plain

File contents

What is it?
TextAreaEditor is a WYSIWYG editor for the textarea.  It works with Ie4.x and above.
I lifted the DHTML editor (from somewhere, yes, i will tell them) and rolled a Zope product that subclassed DTML Document.
Currently, there's no __init__ in the product.  
It uses default init (because i can't find out how to add the __init__ when subclassing DTML Document/Method).
Therefore, some properties are set up after instantiating the product.  A pointer on how to make this better is sought. 
That's the main reason for this release.

Also, i don't know much javascript/dhtml.  so dont ask me those kinda
question.  Do give me the answers, though.
:)

What does it do?
Say we have a form, called post_html with:
###############post_html#######################
<dtml-var standard_html_header>
<h2><dtml-var title></h2>
<form action="getall" method=post">
<br>Name: <input type="text" name="usrname">
<br>Comments: <textarea name="comments" cols=60" rows="6"></textarea>
<br><input type="submit">
</form>
<dtml-var standard_html_footer>
##############################################
the dtml method accepting REQUEST objects from post_html

###############getall########################
<dtml-var standard_html_header>
<h2><dtml-var title></h2>
<br><dtml-var usrname> says:
<br><dtml-var comments>
<dtml-var standard_html_footer>
##############################################

This form will have a plain textarea where users can fill in comments.

Now, with TextAreaEditor, ie users will have a toolbar to help format their comments in the textarea.
This product uses DHTML, and therefore, other browser users will not see anything.

OK, a few modification is needed on the above form.

###############post_html#######################
<dtml-var standard_html_header>
<h2><dtml-var title></h2>
<form action="getall" method=post" onsubmit="copyValue(this)">   <--this
<br>Name: <input type="text" name="usrname">
<br>Comments: <dtml-var comments>  <--this
<br><input type="submit">
</form>
<dtml-var standard_html_footer>
##############################################

notice the onsubmit="copyValue(this)" and <dtml-var comments>.

Where does the <dtml-var comments> come from?  Instantiate a TextAreaEditor with the id comments.

When instantiating TextAreaEditor, it will test for the toolbar image in the parent container.  two properties will also be set for the instance; the height(ifrheight) and width(ifrwidth) of the textarea.

The difference now is that the textarea name is not comments anymore.  its commentsForm (TextAreaEditor id +'Form').

Therefore, the action is now:
 
 ###############getall########################
 <dtml-var standard_html_header>
 <h2><dtml-var title></h2>
 <br><dtml-var usrname> says:
 <br><dtml-var commentsForm>  <----this
 <dtml-var standard_html_footer>
 ##############################################

 Passing texts to TextAreaEditor:

 Sometimes, we may have the texts for the textarea; such as when replying to a post is a message board.
 To pass the value to TextAreaEditor:
 
###############post_html#######################  
 <dtml-call "REQUEST.set('commentsForm',values_from_prev_reply)">
 <dtml-var standard_html_header>
 <h2><dtml-var title></h2>
 <form action="getall" method=post" onsubmit="copyValue(this)">
 <br>Name: <input type="text" name="usrname">
 <br>Comments: <dtml-var "comments(_.None, _, commentsForm=commentsForm)">
 <br><input type="submit">
 </form>
 <dtml-var standard_html_footer>
 ##############################################
 
 and all's set.

 Minimally tested with w2k and w98, ie 5.5.  Use at own risk.  Help, pointers to improve the product, use better __init__, etc are sought.
 If you like it, here's my paypal account.  
 
 nah, just kidding.
 mail me

 thanks