Loading...
Important Notice - Forums is archived

To simplify things and help our users to be more productive, we have archived the current forum and focus our efforts on helping developers on Stack Overflow. You can post new questions on Stack Overflow or join our Discord channel.

Product icon
TUTORIAL

Vaadin lets you build secure, UX-first PWAs entirely in Java.
Free ebook & tutorial.

Execute javascript after draw a DOM element

Maxmiliano Andriani
10 years ago Mar 15, 2013 9:43pm

Hi,

We are using Vaadin 6.7.8, and we have the Vaadin integrated with other web technology like jQuery events and pure javascript codes. I need to call a javascript function after Vaadin finish to draw the DOM element in client side. The code will put addtional events in this element (drag and drop, save and change listeners, draw the charts, etc)...

Today we use a workaround method. I created a callback listener. This listener check at each 100 ms if the div was created in DOM, if true, then execute the callback... The below code was working well.

x.c.callback = new function Callback(){
    
    var that = this;
    this.events = [];
    
    this.callFn = function(event) {
        this.events[event].fn();
    };
    
    this.check = function(event) {
		var checkObject = jQuery(this.events[event].container);
		if (checkObject.length > 0) {
			this.callFn(event);
		} else {
			if (this.events[event].i <= 500) {
				this.events[event].i++;
				this.events[event].timeEvent = setTimeout(function() { that.check(event); }, this.events[event].time);
			} else {
				console.warn('aborting... event: '+event+' '+this.events[event].container);
				delete this.events[event];
			}
		}
    }

    this.set = function(Fn){
    	var id = c.createID();
    	this.events[id] = {
    		ID : id,
    		fn : (typeof Fn == 'object' && typeof Fn.fn == 'function') ? Fn.fn : function(){},
	        container : (typeof Fn == 'object' && typeof Fn.container != 'undefined') ? Fn.container : document,
	        time : (typeof Fn == 'object' && jQuery.isNumeric(Fn.time))? Fn.time : 100,
	        timeEvent : '',
	        i: 0
    	};
    	this.check(id);
    }
};

The problem is: When the sistem is overloaded; The user can do multiple clicks in a vaadin button... For each click, I remove the related DIVs and add a callback listener... When Vaadin execute the fist click, my callback will be validated and all listeners in the pool will be added. But, Vaadin will execute the second click and don't have more events to be added...

For a full solution, I need Vaadin call something after finish drawing the DIV in DOM.
The executeJavascript() always call the javascript before draw the DIV in DOM.

Maxmiliano Andriani
10 years ago Mar 21, 2013 9:59pm

can anybody help me?