How are we supposed to use Forms?

In the process of writing the Form chapter of the Vaadin Fundamentals course, I figure out that I rarely use forms (while I use fields a lot). I’m not sure how I’m supposed to use them, and the corresponding chapter in the Book of Vaadin doesn’t help me much in this case.

Here is the problem:

Typically, when you use a form you want it to close when the user presses ok or cancel. It may mean closing a modal dialog box (window) containing the form, or removing the in-place editor on the page.

You also want to save the edited data to the DB if Ok was pressed.

The ok button processing is something like:

  1. perform validation, and if problem stop.
  2. reload the JPA edited entity from the DB (so it’s managed and not detached)
  3. fill that entity with the buffered form
  4. save the entity in the DB (could be automatic with dirty checking)
  5. close the form (close the modal window or remove the in place editform from the page)

If the cancel button is pressed, you just close the form (step 5).

My question is: How do you typically structure the code?

Suggestions of answers:

  • You extend Form and override commit(). You instantiate the ok button in you form descendant. Your ok button triggers the commit method ?
  • You define (instantiate) the ok button in your modal Window. It triggers a ClickListener anonymous inner class which calls form.commit().
  • You just never user the Form class…

So … after 3 weeks no reply. It means that it’s not clear how we are supposed to use form; it’s not just me who does not understand. Let’s mark this thread as “a question”.

Sorry that no one has answered the question. I use forms every now and then. The way I do it is option 2. I define my own okay and cancel buttons, and in the okay’s ClickListener I call form.commit(), store the object where ever it should go and change view/show notification/close popup window.

Forms gives you for free isModified, commit and validate which is very nice, but they are sometimes quite hard to use, and thus very underused in general. I have been planning of writing a form tutorial in the form of three blog posts for the last two months, but I haven’t been able to do it yet. My work situation for the moment could possibly allow me to write them some time this month.

I like the idea of a form tutorial. Hope to see it pretty soon… :grin:

I personally usually place the OK button in the form footer (unless the UI designers say otherwise), either from the surrounding code or in a subclass of Form depending on the case. Most of the time, I handle e.g. saving entities to the database outside the commit() method if not using a container that saves them automatically.

I try to avoid putting in the form class itself code that acts on the UI outside the form. Instead, even if the OK button is defined in the form, I let the user of the form register listeners that e.g. close the window or do some other “external” updates.

I’m sure others would have more to say about the approaches they are taking. My views might be colored by that I mostly work on the framework itself and on integrations etc., not on big business applications.

I do know that several projects avoid using the Form component - usually at first to customize the layout and maybe some logic or conversions. In most of those cases, it would be possible to use Form and the developer would get some functionality “for free”, but I admit it is not as easy as it should be and has been even more difficult in the past. The FieldWrapper and CustomField in the
CustomField add-on
often help if you need to do conversions etc.

Making forms more “usable” from the developer perspective is definitely near the top of our list of things to improve, but bigger improvements might require breaking existing APIs, which is why it has not been done in minor versions.

The Forms chapter (tutorial) is here:


http://www.blackbeltfactory.com/ui#CoursePage/13818629/EN

Thank you guys for your help!

I think the Form handling in Vaadin is by far the weakest part of the framework. It really starts if you leave the most simple forms and starting doing complex ones. In fact its so weak that i started thinking if Vaadin fits my needs all in all because for Business Apps, Forms are really really important.

I dont say that you cant do certain things. I just say its too difficult to implement advanved forms. Multi-Columns forms with built-in error indicators and different text alignement for instance. You need to rewrite so much stuff that it feels like there is no framework at all. And i havent even mentioned the whole binding part.

Just my 2 cents.

Marc

I agree Form (and to a smaller extent Field/AbstractField) is in dire need of rework/improvements to be usable in more real-world applications. Both the layouting and data binding/conversion sides need work, and field creation is also related to these.

While it is already possible to do a lot with the Form component, many things that should be simple take too much work and code, and are not at all obvious. For me, personally, it is one of the top two or three enhancements needed in Vaadin.

Reworking it has long been planned for Vaadin 7 as it may lead to several API changes, but Vaadin 7 has been pushed forward and some of the enhancements planned for it (with minimal API impact) have been added to new 6.x series releases added to the roadmap. I’m afraid bigger form rework will have to wait until Vaadin 7, I hope later this year. In the meanwhile, some add-ons (including
CustomField
) do help a little, but do not address many of the core issues.

Henri,

well said. Good to hear that i am not the only one thinking about it this way. If this part of Vaadin would be improved, we would see a lot more apps in a shorter timeframe created with Vaadin, for sure. For us our complete development nearly halted because of those form issues and we dont do extraordinary things here.

Of course i also played with CustomField and its something you can use for certain things but unfortunately it doesnt solve much of the pain points.

One remark: Why is the default text alignment for fields “top” and not “left” ? Alone this fact generates massive problems because changing is not simple and even if you do it (which essentially means not using the label feature of TextField), you still have the error indicator problem. I think 95% of all business apps have left-aligned text before textfields and the decission to make “top” alignment default was a bad one.

But dont get me wrong. I still like Vaadin and because i do, i need to expose my oppinion here.

Marc