JavascriptExtension: this.getElement() returns always null?

Vaadin 6 / 7 / 8
1

Hi,

I am trying to integrate a Javascript-library using a Javascript-Extension, but I cannot get it to work. In my connector I am basically doing the same as the
Book of Vaadin
 says, but this.getElement() always returns null.

Connector:

window.de_tobiasdemuth_vaadin_MyExtension =
function() {
    
    alert(this.getElement());
    
    // Create the component
    var ext = js.init(this.getElement());
    
    // Handle changes from the server-side
    this.onStateChange = function() {
        // left out
    };
    
};

Usage in UI:


@Override
	protected void init(VaadinRequest request) {
		final VerticalLayout layout = new VerticalLayout();
		layout.setMargin(true);
		setContent(layout);

		final TextArea ta = new TextArea();
		new MyExtension().extend(ta);
		layout.addComponent(ta);
	}

Does anybody have an idea what I am doing wrong here?

kind regards
Tobias

2

Try using

var connectorId = this.getParentId(); var element = this.getElement(connectorId); If I remember correctly, this.getElement() works for Javascript components but for extensions, you need to pass the parent connector id (the extension itself has no own element)

3

Hi Artur,

thanks, that solved the issue. The Book of Vaadin needs an update there, I’ll go and notify Marko …

kind regards
Tobias