The Artima Developer Community
Sponsored Link

Java Buzz Forum
Rich text editing in a WebWork application

0 replies on 1 page.

Welcome Guest
  Sign In

Go back to the topic listing  Back to Topic List Click to reply to this topic  Reply to this Topic Click to search messages in this forum  Search Forum Click for a threaded view of the topic  Threaded View   
Previous Topic   Next Topic
Flat View: This topic has 0 replies on 1 page
Florian and Rolf

Posts: 12
Nickname: digitalde
Registered: Jul, 2005

Florian and Rolf are java developers.
Rich text editing in a WebWork application Posted: Jul 22, 2005 9:04 PM
Reply to this message Reply

This post originated from an RSS feed registered with Java Buzz by Florian and Rolf.
Original Post: Rich text editing in a WebWork application
Feed Title: Heulen wie ein Schlosshund
Feed URL: http://www.contegix.com/blog/index.rdf
Feed Description: Florian and Rolf talk about the trials and tribulations of software development in the java world.
Latest Java Buzz Posts
Latest Java Buzz Posts by Florian and Rolf
Latest Posts From Heulen wie ein Schlosshund

Advertisement

The current project I am working on is a fairly simple web application using WebWork. Though the application is fairly simple, the time frame we have to work with is very short. So when the customer requested features such as rich text editing capabilities ao that content authors can be creative with the updated content, I freak out a little. This is mainly because I have never had to incorporate rich text editing on any web application I have developed before and I had no idea of what was involved. I envisaged it being potentially a lot of work to add such support.

So I spent a couple of hours researching what tools, and techniques are available and what would best suit our needs. It was during this that I came across FCKeditor. This is an open source rich text editor implemented in JavaScript that is also supported in multiple browsers. Have a look at http://fckeditor.net/demo/ for a working sample.

So my first question is how can I use this in my WebWork application? I still want the mechanism in WebWork that ensures that my form fields are set on my WebWork action to still work with out having to do a lot of extra work. The solution turned out to be surprisingly simple.

FCKeditor supports two ways of embedding a rich text control into your page.

The first way involves placing an FCKeditor inline by inserting similar JavaScript as below into the desired location for the rich text control to appear:

<script type="text/javascript">
    var oFCKeditor = new FCKeditor('richTextField');
    oFCKeditor.Create();
</script>

A personal hate of mine is to have JavaScript riddled through out my pages and so I am not a big fan of this method. I also failed to see an easy way that this was still going to work with the WebWork framework.

A second method involves replacing TEXTAREA tags with an FCKeditor as the page loads. This involves adding an "onload" method to the page that can do the replacement:

<html>
  <head>
    <script type="text/javascript">
      window.onload = function()
      {
        var oFCKeditor = new FCKeditor('richTextField');
        oFCKeditor.ReplaceTextarea() ;
      }
    </script>
  </head>
  <body>
    <textarea id="richTextField" name="richTextField">Some sample <b>formatted<b> text.</textarea>
  </body>
</html>

Using this approach, I was able to take my jsp page with my form and textareas defined with WebWork's custom tags, and add the "onload" method to replace the various textareas with an FCKeditor. It worked perfectly.

  <head>
    <script type="text/javascript">
      window.onload = function()
      {
        var oFCKeditor = new FCKeditor('richTextField');
        oFCKeditor.ReplaceTextarea();
      }
    </script>
  </head>
  <body>
<ww:form method="'post'" name="'inputform'" action="'save.action'" >
    <ww:textarea label="'Rich Text Field'" name="'richTextField'" rows=5 cols=40 />
    <ww:submit value="'Save'" align="center" />
</ww:form>
  </body>
</html>

In the end, a requirement that I feared could potentially burn up a lot of valuable time took no more than a morning to research and implement.

Read: Rich text editing in a WebWork application

Topic: Unit Testing Pt.2 Previous Topic   Next Topic Topic: Configuration management for non-Java apps

Sponsored Links



Google
  Web Artima.com   

Copyright © 1996-2019 Artima, Inc. All Rights Reserved. - Privacy Policy - Terms of Use