Creating apps for devices with relatively small screens (like smartphones or iPod) but not just for them, we need to switch between views. Firstly, user sees list, then choosing something in list he gets to item details screen or to another list, then to registration form or something else. So, generally your application consists of some number of views, which change one another in different order using some kind of animation or without it.
To solve this problem with TOUCH library you need to use MULTIVIEW component. Each cell of this component is a view of a type you need to be shown at a time. For more details about MULTIVIEW component see corresponding chapter of this manual. Here is a code snippet of MULTIVIEW initialized with list and form as its cells:
dhx.ui({ view:"multiview", cells:[{view:"list", id:"mylist" ... }, {view:"form", id:"myform" ... }] });
Having views with IDs installed as MULTIVIEW cells, we can switch between them using show() method, like this:
$$("id_of_cell_view").show();
You just need to choose the event you’d like to initiate the switch. This can be button click or toolbar event or list item click or any other (read more about EVENTS here).
Let it be 'onafterselect' event, as we already have the list as the first cell of MULTIVIEW:
$$("mylist").attachEvent("onafterselect",function(id){ loadMyForm(id);//this is your function which should load form with data based on clicked item ID $$("myform").show();//this is we here for. MULTIVIEW will be switched to the cell with form view })
Related articles: