Javascript error on custom component

Hi there,

I’m using vaadin 6.8.6 and I have developed a custom component.
Unfortunately I got a javascript error but I don’t understand why.

This is the error (javascript are ‘prettified’):

avaScriptException: (TypeError): size.lastIndexOf is not a function
 fileName: http://localhost:8080/overviewtable/VAADIN/widgetsets/com.mycompany.internal.widgets.overview.OverviewtableWidgetset/15991E62DE94678CD75737CB4F000063.cache.html

Right now, VOverviewTable.updateFromUIDL is never called. But I understand that a client-side error could prevent the call of this method.
The error happens when the component is being rendered in the page and the error is in vaadin console. Server side I don’t have any error.

Thanks for any help.

Server side component:

public class OverviewTable extends AbstractComponent {

	private static final long serialVersionUID = -3387341007298022602L;
	private String data = "";
	
	
	private String theme = "twitter";

	@Override
	public void paintContent(PaintTarget target) throws PaintException {
		super.paintContent(target);
		
		target.addAttribute("data", data);
		target.addAttribute("height", getHeight());
		target.addAttribute("width", getWidth());
		target.addAttribute("theme", theme);

	
	}

	/**
	 * Receive and handle events and other variable changes from the client.
	 * 
	 * {@inheritDoc}
	 */
	@Override
	public void changeVariables(Object source, Map<String, Object> variables) {
		super.changeVariables(source, variables);
	}

	/**
	 * Set JSON data that will be displayed in the component.
	 * @param data
	 */
	public void setJSONData(String data){
		this.data = data;
		
		requestRepaint();
	}
}

client side component:

public class VOverviewTable extends Widget implements Paintable {

	/** Set the CSS class name to allow styling. */
	public static final String CLASSNAME = "v-overviewtable";

	public static final String CLICK_EVENT_IDENTIFIER = "click";

	/** The client side widget identifier */
	protected String paintableId;

	/** Reference to the server connection object. */
	protected ApplicationConnection client;
	
	private String data = ""; // data that will be displayed in the component. Must be in JSON
	private String width = "800"; 
	private String height = "600"; 
	
	/**
	 * The constructor should first call super() to initialize the component and
	 * then handle any initialization relevant to Vaadin.
	 */
	public VOverviewTable() {
		// TODO This example code is extending the GWT Widget class so it must set a root element.
		// Change to a proper element or remove this line if extending another widget.
		DivElement topElement = buildComponent();
		
		setElement(topElement);
		setSize("800", "600");
		
		// This method call of the Paintable interface sets the component
		// style name in DOM tree
		setStyleName(CLASSNAME);
	
	}

	private DivElement buildComponent() {
		DivElement topElement = Document.get().createDivElement();
		
		
		DivElement divElement = Document.get().createDivElement();
		divElement.setId("listView");
		
		ScriptElement scriptElement = Document.get().createScriptElement();
		scriptElement.setType("text/javascript");
		scriptElement.setInnerText(buildJavascript());
		
		topElement.appendChild(divElement);
		topElement.appendChild(scriptElement);
		return topElement;
	}
    
    public String buildJavascript(){
		StringBuffer buff = new StringBuffer();
		
		buff.append("$(document).ready(function(){");
		buff.append("listView = new napps.ui.ListView('listView',{");
		buff.append("layout: 'A',");
		buff.append("theme: 'twitter',");
		buff.append("orientation: 'V',");
		/*if ("".equals(height)){
			buff.append("height: '%s',".replace("%s", height));
		}
		if ("".equals(width)){
			buff.append("width: '%s',".replace("%s", width));
		}*/
		buff.append("height: '800',");
		buff.append("width: '600',");
		buff.append("isItemUniform: true");
		buff.append("});");
		buff.append("var data = '%s';".replace("%s", data));
		buff.append("listView.setItems(data);");
		buff.append("});");
		
		return buff.toString();
    }
    
	
    
    
    /**
     * Called whenever an update is received from the server 
     */
	public void updateFromUIDL(UIDL uidl, ApplicationConnection client) {
		// Save reference to server connection object to be able to send
		// user interaction later
		this.client = client;

		// Save the client side identifier (paintable id) for the widget
		paintableId = uidl.getId();
		
		String newdata = uidl.getStringAttribute("data");
		String newheight = uidl.getStringAttribute("height");
		String newwidth = uidl.getStringAttribute("width");

		boolean needsToBeRepainted = evaluateIfNeedsToBeRepainted(newdata, newheight, newwidth);
		
		if (needsToBeRepainted){
			
			DivElement element = buildComponent();
			
			setElement(element);
			
			this.data = newdata;
			this.height = newheight;
			this.width = newwidth;
		}
		
		
		
		
	}

	private boolean evaluateIfNeedsToBeRepainted(String newdata, String newheight,
			String newwidth) {

		return !newdata.equals(data) || !newheight.equals(height) || !newwidth.equals(width);
	}

  
}

I partially solved.

Parameters were not added as Strings but as float. Once I pass those parameters as string I don’t have console errors.

But VOverviewTable.updateFromUIDL is no called.

I think that the problem is how to notify the client side of my component about the new data available.

I know that the communication client->server is done with

client.updateVariable(paintableId, variableName, newValue, immediate)

but how to notify the client about the new data ?
I need to do it in OverviewTable.setJSONData because when this method is called I need to ‘refresh’ the client side of the component.

Thanks