How to handle dynamic creation of view in alloy xml - titanium

Question

I have very simple view index.xml
<Alloy>
<Window id="byFav">
<TableView id="tableByFav" />
</Window>
<Alloy>
in this program I want to open webView and use this instead of tableByFav View
when you click tableByFav.
I am not sure how to describe this process in xml.
So I write code in index.js like this.
$.tableByFav.addEventlistener('click',function(e){
entryWindow = Titanium.UI.createWindow({
title: "window"
});
entryView = Titanium.UI.createWebView({
url: "google.com"
});
entryWindow.add( entryView );
$.byFav.open( entryWindow );
}
However I am not sure it is obeying the concept of alloy.
I am trying to understand the concept of alloy.

Answer 1

You are opening the wrong window, try this instead:
$.tableByFav.addEventlistener('click',function(e){
var entryWindow = Titanium.UI.createWindow({
title: "window"
});
var entryView = Titanium.UI.createWebView({
url: "http://www.google.com"
});
entryWindow.add( entryView );
// Call open on the entry window itself
entryWindow.open({
modal : true // Set to true if you want an opening animation
});
}
To do this with Alloy, you can create a controller for the webview named (entryWindow.xml) like this:
<Alloy>
<Window id="entryWindow">
<WebView id="entryView" />
</Window>
<Alloy>
And the in controller (entryWindow.js) you can set the url from the supplied arguments:
$.entryView.url = arguments[0].url;
Now in your index controller, you would open the webview like this:
$.tableByFav.addEventlistener('click',function(e){
// Create a controller, pass url argument
var controller = Alloy.createController('entryWindow', {url: "http://www.google.com"});
// Get the controller's view (a window) and open it
controller.getView().open({
modal : true // Set to true if you want an opening animation
});
}