After spending some time with Vaadin and developing a small application and a usability framework the moment came in which Vaadin application had to be integrated with another existing application. The integration wasn't tough at all due to the nice work done by the Vaadin folks.
However at my place we have separate team for Vaadin core development and jQuery / JavaScript doing the client side hacking. So to make the job easier for both the sides I developed a small Contact Us demo application which creates a Vaadin form and beautifies it with jQuery Effects and Tooltip plugin.
Very interesting indeed! Thanks for sharing.
ReplyDeleteCan you share the source, sound very promising.
ReplyDeleteHi, it's very interesting, It's possible for you to share the Java Code?
ReplyDeleteHello Joe,
ReplyDeleteSorry I don't have the vaadin/java source available with me.
But if you see the HTML source I have included in the example, I refer the controls with their class names. Now Vaadin does provide functionality to mark additional style classes. Rest of the code is plain Vaadin which you can get from its demo site as well.
Keep Coding!!!
Hello Dhval,
ReplyDeleteI'm trying something like
CustomLayout custom = new CustomLayout("testJQuery"); // Your html source
custom.addComponent(new Panel("CONTACT US"), "contactUs");
Panel panelApp = new Panel();
custom.addComponent(panelApp, "vaadin");
TextField username = new TextField();
panelApp.addComponent(username);
panel.setContent(custom);
but unfortunately it does not work :-(
I'll be coding :-D
Your text field can not be identified easily in above case. Try add following:
ReplyDelete//vaadin
username.addStyleName('username')
//javascript
$(".username").live(...);
This change should work.
i tried it but it is not still working, if you can I will be very grateful if you share the full code
ReplyDeleteto find you what is going wrong
thanks
Joe
Please refer following gist where I have put the source files. I could not find the original source but the gist is made from the working application.
ReplyDeletehttps://gist.github.com/2b9848463355e7ae7d70
Hello Dhval,
ReplyDeletethanks for you support :-D !!!
Hi,
ReplyDeletethanks for this useful example. I have a need explained in this thread :
https://vaadin.com/forum/-/message_boards/view_message/1793730.
Regards
Walid