Vaadin 10 Examples bug?

I downloaded the Vaadin 10 Examples from your INTRODUCTION TO VAADIN 10 TRAINING web page.

Everything worked except for clicking the button in the ExampleTemplate class. I copied the code from your Solutions folder.

The Exercises.pdf document says:

“Create an interface called ExampleModel, ExampleModel should extend from
TemplateModel, and it has only two methods, getValue() and setValue().”

In your Solutions this interface is defined inside the ExampleTemplate class but the words “That’s all for the client side.” appear after the instruction to create the ExampleModel interface. I suppose that that’s an error because ExampleModel is defined on the Java side not on the client side, as far as I can see.

Then I create the ExampleTemplate Java class, adding the ExampleModel model interface and ending up with:

@Tag( "example-template" )
@HtmlImport( "example-template.html" )
public class ExampleTemplate extends PolymerTemplate<ExampleModel>
{
  /**
   * Template model which defines the single "value" property.
   */
  public interface ExampleModel extends TemplateModel
  {
    void setValue( String value );
    String getValue();
  }

  /**
   * Public setter to use from other Java classes. Not mandatory, but useful.
   */
  public void setValue( String value )
  {
    getModel().setValue( value );
  }

  @EventHandler
  private void handleClick()
  {
    try
    {
      System.out.println( "handleClick start" );
      Thread.sleep( 2000 );
      getModel().setValue( "Vaadin!" );
      System.out.println( "handleClick end" );
    }
    catch( final InterruptedException e )
    {
      e.printStackTrace();
    }
  }
}

I notice that the ExampleModel interface is not referenced anywhere either in the Java code or in example-template.html.

Here is the example-template.html file:

What's the best UI framework? Search
{{value}}

When I run this the template’s contents are displayed but clicks on the button do nothing and, in fact, the handleClick method in the ExampleTemplate class is not called.

I tried changing that button to a vaadin-button but that made no difference.

Any idea what is wrong?

thanks,

Terry?

Here is the HTML file that is part of the previous message:

17279081.html (741 Bytes)

It seems that you’re using some other character instead of quotation marks for the on-click attribute:

17279853.png

Looks possibly like a case where you copy-pasted some “ characters (https://www.compart.com/en/unicode/U+201C) where you would actually want " characters (https://www.compart.com/en/unicode/U+0022).

Thanks to Artem and Olli. Not sure how the curly quotes got there but they are the problem.

I still don’t quite understand the use of the ExampleModel interface which does not seem to be called by anything.

Terry