Skip to Main Content
Vaadin 7 UI Design By Example: Beginner's Guide
book

Vaadin 7 UI Design By Example: Beginner's Guide

by Alejandro Duarte
July 2013
Beginner content levelBeginner
246 pages
5h 3m
English
Packt Publishing
Content preview from Vaadin 7 UI Design By Example: Beginner's Guide

Time for action – creating a JavaScript component

Follow these steps and see how easy is to incorporate an existing JavaScript component in Vaadin applications:

  1. Create a new Vaadin project with the name javascriptspinner using your IDE.
  2. Create a new class for our custom JavaScript based component inside a javascriptspinner package:
    @JavaScript({ "spinner.js",
        "http://code.jquery.com/jquery-1.9.1.js",
        "http://code.jquery.com/ui/1.10.3/jquery-ui.js" })
    public class Spinner extends AbstractJavaScriptComponent {
    }
  3. Place a new JavaScript file spinner.js beside the previous class:
    javascriptspinner_Spinner = function() {
      var e = this.getElement();
      e.innerHTML = "<input id='spinner' />";
      var spinner = $("#spinner").spinner();
    };
  4. Use the component as you would ...
Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.
Start your free trial

You might also like

Vaadin

Vaadin

Joachim Baumann, Daniel Arndt, Frank Engelen, Frank Hardy

Publisher Resources

ISBN: 9781782162261Other