demetrio.it blog

Some times it can happen you need to re-render a block that includes the RichFaces editor: if the user is using to edit a piece of text, after the re-rendering the caret goes back to the first place so if the user were writing he’d have to manually move it every time it happens.

The solution to this problem (that you can use also for other purposes) is a javascript piece of code found on the TinyMCE forum, adapted for the RichFaces specific case:

<script type="text/javascript">
    function moveCaretToTheEnd(editor_jsf_id) {
        var editor_id = editor_jsf_id + 'TextArea';
        var ed = tinyMCE.getInstanceById(editor_id);
        var root = ed.dom.getRoot();  // This gets the root node of the editor window
        var lastnode = root.childNodes[root.childNodes.length - 1]; 
        if (tinymce.isGecko) {
            // But firefox places the selection outside of that tag, so we need to go one level deeper:
            lastnode = lastnode.childNodes[lastnode.childNodes.length - 1];
        }
        // Now, we select the node
        ed.selection.select(lastnode);
        // And collapse the selection to the end to put the caret there:
        ed.selection.collapse(false);
    }
</script>

The only change I had to do is on the first line of the script as the id of the component we have to pass to get the editor instance is +”TextArea” so I had to compose the id passed to the js function with the “TextArea” string.

To discover the id of the component we can use the built-in RichFaces function rich:clientId in this way (example in a poll component):

<a :poll reRender="currentChatMsgs,recipientList,threadFoldedSection"
        oncomplete="moveCaretToTheEnd('#{rich:clientId('myEditorJsfId')}')"
        enabled="true"/>

Demetrio Filocamo

——

JBoss RichFaces 3.3 (book) – http://www.packtpub.com/jboss-richfaces-3-3

Learn RichFaces step by step developing a sample application.

Hello,
I’ll try to write more on my blog and keep you update about every technique I use and that can be very useful to you as well.

Today I needed to submit a form with an editor element when the user pressed the “return” key (instead of creating a new line).

The code is not so complicate but as the rich:editor uses the TinyMCE component you have to search all around to find the right way. Better to have a complete solution.

It consists on creating an handler onKeyPress and call a javascript function (created by a:jsFunction) to submit our form. Simpler doing then saying it.

Let’s start by including the editor in the standard way (form, editor, submit button):

<h :form>
    <rich :editor value="#{editorBean.myValue}" />
    <a :commandButton value="Send" reRender="something"/>
</h>

I’ve kept it simple (stripped out all the params and attribute I use) to target only our problem.

Let’s define a javascript function handler for our use case:

<script type="text/javascript">
    function returnSubmit(ed) {
        ed.onKeyPress.add(function(ed, e)
        {
            var keyCode = e.keyCode || e.which || e.charCode;
            if (keyCode == 13)
            {
                // My return key handler code here 
            }
        });
    }
</script>

The ed variable will be passed by the editor; let’s configure our new function to the onsetup editor event:

<h :form>
    <rich :editor 
                value="#{editorBean.myValue}" 
                onsetup="returnSubmit(ed)" />
    <a :commandButton value="Send" reRender="something"/>
</h>

Now we have a function that is called for each keyPress event, and inside it we can execute something on “return” key press.

What we have to do is to submit the form, the best way is to create an Ajax javascript function using a:jsFunction: in this way we can do standard Ajax updates also reRendering elements, submitting params and all the thing we are used to

Let’s create the function:

<h :form>
    <rich :editor 
                value="#{editorBean.myValue}" 
                onsetup="returnSubmit(ed)" />
    <a :commandButton value="Send" reRender="something"/>
    <a :jsFunction name="submitForm" reRender="something"/>
</h>

Now we have to insert it into the handler and it’s done!

Here it is the whole code:

<script type="text/javascript">
    function returnSubmit(ed) {
        ed.onKeyPress.add(function(ed, e)
        {
            var keyCode = e.keyCode || e.which || e.charCode;
            if (keyCode == 13)
            {
                // My return key handler code here 
                submitForm();
            }
        });
    }
</script>

<h :form>
    <rich :editor 
                value="#{editorBean.myValue}" 
                onsetup="returnSubmit(ed)" />
    <a :commandButton value="Send" reRender="something"/>
    <a :jsFunction name="submitForm" reRender="something"/>
</h>

Another tip
If with the js function you reRender components, do some action, set some property etc., to avoid duplication of code in the commandButton you can use the same js function into the button using the onclick attribute:

<h :form>
    <rich :editor 
                value="#{editorBean.myValue}" 
                onsetup="returnSubmit(ed)" />
    <a :commandButton value="Send" onclick="submitForm();"/>
    <a :jsFunction name="submitForm"
                  action="#{myBean.myAction}"
                  oncomplete="doSomething();"
                  reRender="first,second">
        <f :setPropertyActionListener value="valueToSet" target="#{myBean.firstValue}"/>
    </a>
</h>

Demetrio Filocamo

——

JBoss RichFaces 3.3 (book) – http://www.packtpub.com/jboss-richfaces-3-3

Learn RichFaces step by step developing a sample application.

Adding Cache support to a Seam project (Seam 2.1.x) it’s very simple and it is described in the official Seam developer documentation, anyways it doesn’t explain the exact steps to accomplish the task into an EAR project, I’m writing them to make your life even more simple

• Add treecache.xml (you can find it into the seam blog example) to /resources/META-INF/
• Open build.xml for editing, go to the “ear” target and tell to copy the treecache.xml file:
  <target name=”ear” description=”Build the EAR structure in a staging directory”>
  …
      <copy todir=”${ear.dir}/META-INF”>
          <fileset dir=”${basedir}/resources/META-INF”>
              <include name=”application.xml”/>
              <include name=”jboss-app.xml”/>
              <include name=”seam-deployment.properties”/>
              <include name=”treecache.xml”/>
          </fileset>
      </copy>
  </target>
• Edit components.xml, add the following XMLNS:
  xmlns:cache=”http://jboss.com/products/seam/cache”The following schema location:
  http://jboss.com/products/seam/cache http://jboss.com/products/seam/cache-2.1.xsd 

  And the following declaration:
  <cache:jboss-cache-provider configuration=”META-INF/treecache.xml” />

• Edit deployed-jars-ear.list and add the required JARs, I used the JBoss Cache 1.x for JBoss AS 4.2.X:
  jboss-cache.jar
  jgroups.jarHere there is the list of jars (and versions) for other configurations.

And here you find the way how to use it in your projects.

Hope you liked it.

Demetrio

Adding a one-to-one relationship with shared primary key can become a difficult task if the main table key is an auto-generated one.

Even the Hibernate Annotations documentation example only works with not auto-generated id, if you try to use an auto incremental id, for example, 

it’s impossible to persist the 2 tables at the same time.

Surfing on the net I’ve seen some ppl with this kind of problem (I suppose one-to-one relationships are not so common, don’t know why) and most of ppl use the foreign-key approach that works ok but it’s not clean from my point of view, so I wanted to find a solution for my case.

The original example from the Hibernate Annotations Documentation is:

@Entity
public class Body {

    @Id
    public Long getId() { return id; }

    @OneToOne(cascade = CascadeType.ALL)
    @PrimaryKeyJoinColumn
    public Heart getHeart() {
        return heart;
    }

    …

}

@Entity
public class Heart {

    @Id
    public Long getId() { … }

}

As you can see this as not auto generated id and will not work just putting the @GeneratedValue annotation.

The final solution is:

@Entity
public class Body {

    @Id
    @GeneratedValue(strategy = IDENTITY)
    public Long getId() { return id; }

    @OneToOne(cascade = CascadeType.ALL)
    @PrimaryKeyJoinColumn
    public Heart getHeart() {
        return heart;
    }

    …

}

@Entity
public class Heart {

    @Id
    @GeneratedValue(generator=”foreign”) 
    @GenericGenerator(name=”foreign”, strategy = “foreign”, parameters = {@Parameter(name=”property”, value=”body”)})
    public Long getId() { …}

    @OneToOne(mappedBy=”heart”)
    public Body getBody() { … }

}

I had a little problem while working on a JBoss Seam project: I used the MySQL decimal(10,2) type for price value but, while running seam tests, the hbm2ddl schema validator gave me this error:

Caused by: org.hibernate.HibernateException: Wrong column type: shippingCost, expected: numeric(10,0)
[testng]     at org.hibernate.mapping.Table.validateColumns(Table.java:261)
[testng]     at org.hibernate.cfg.Configuration.validateSchema(Configuration.java:1083)
[testng]     at org.hibernate.tool.hbm2ddl.SchemaValidator.validate(SchemaValidator.java:116)
[testng]     at org.hibernate.impl.SessionFactoryImpl.<init>(SessionFactoryImpl.java:317)
[testng]     at org.hibernate.cfg.Configuration.buildSessionFactory(Configuration.java:1294)
[testng]     at org.hibernate.cfg.AnnotationConfiguration.buildSessionFactory(AnnotationConfiguration.java:918)
[testng]     at org.hibernate.ejb.Ejb3Configuration.buildEntityManagerFactory(Ejb3Configuration.java:656)
[testng]     … 68 more

The problem is that hbm2java usa a wrong column definition for the entity property, in fact the @Column annotation on the property was:

@Column(name = “shippingCost”, nullable = false, precision = 10)

The solution is simple, just change it to:

@Column(name = “shippingCost”, nullable = false, precision = 10, scale=2, columnDefinition=”decimal(10,2)”)

Now the type is correctly defined and the schema validator doesn’t return any error.

Demetrio