-
26 Oct 2010 6:41 AM #1
Implementation of AsyncTree
Implementation of AsyncTree
Hi folks,
I would like to implement an Async Tree which is stored on server side but having a problem with it.
Problem is, that nothing is displayed - so I'm probably missing something within my code.
where DatabaseServiceImpl.java includes:Code:protected void initUI() { adminMenu = new ContentPanel(); adminMenu.setHeading("Administrace"); adminMenu.setAnimCollapse(false); adminMenu.addListener(Events.Expand, new Listener<ComponentEvent>() { public void handleEvent(ComponentEvent be) { Dispatcher.get().dispatch(AppEvents.NavAdministrace); } }); service = (DatabaseServiceAsync) Registry.get(Agdoprava.SERVICE); // data proxy RpcProxy proxy = new RpcProxy() { @Override protected void load(Object loadConfig, AsyncCallback callback) { service.getAdministraceFolders(callback); } }; // tree loader TreeLoader loader = new BaseTreeLoader(proxy) { @Override public boolean hasChildren(ModelData parent) { return parent instanceof Folder; } }; // trees store TreeStore<Folder> store = new TreeStore<Folder>(loader); /* store.setStoreSorter(new StoreSorter<Folder>() { @Override public int compare(Store store, Folder m1, Folder m2, String property) { boolean m1Folder = m1 instanceof Folder; boolean m2Folder = m2 instanceof Folder; if (m1Folder && !m2Folder) { return -1; } else if (!m1Folder && m2Folder) { return 1; } return super.compare(store, m1, m2, property); } }); */ Tree tree = new Tree(); TreeBinder<Folder> binder = new TreeBinder<Folder>(tree, store); /* binder.setIconProvider(new ModelStringProvider<Folder>() { public String getStringValue(Folder model, String property) { if (!(model instanceof Folder)) { String ext = model.getName().substring(model.getName().lastIndexOf(".") + 1); // new feature, using image paths rather than style names if ("xml".equals(ext)) { return "images/icons/page_white_code.png"; } else if ("java".equals(ext)) { return "images/icons/page_white_cup.png"; } else if ("html".equals(ext)) { return "images/icons/html.png"; } else { return "images/icons/page_white.png"; } } return null; } }); */ binder.setDisplayProperty("name"); loader.load(null); adminMenu.addText("<div style='font-size: 12px;padding-bottom: 8px'>Tree which loads its children on demand using a remote service.</div>"); adminMenu.add(tree); /* Tree tree = new Tree(); TreeLoader loader = new BaseTreeLoader(new TreeModelReader()); TreeStore<ModelData> store = new TreeStore<ModelData>(loader); TreeBinder binder = new TreeBinder(tree, store); binder.setAutoLoad(true); binder.setDisplayProperty("name"); binder.setIconProvider(new ModelStringProvider() { public String getStringValue(ModelData model, String property) { if (((TreeModel) model).isLeaf()) { return "icon-music"; } return null; } }); service = (DatabaseServiceAsync) Registry.get(Agdoprava.SERVICE); service.getAdministraceFolders("xxx yyy zzz", new AsyncCallback<Folder>() { public void onFailure(Throwable caught) { System.out.println("AdministraceFolderView.onInit.getAdministraceFolders.onFailure"); Dispatcher.forwardEvent(AppEvents.Error, caught); } public void onSuccess(Folder result) { System.out.println("AdministraceFolderView.onInit.getAdministraceFolders.onSuccess"); Dispatcher.forwardEvent(AppEvents.NavAdministrace, result); } }); StoreFilterField filter = new StoreFilterField<ModelData>() { @Override protected boolean doSelect(Store store, ModelData parent, ModelData record, String property, String filter) { // only match leaf nodes if (record instanceof Folder) { return false; } String name = record.get("name"); name = name.toLowerCase(); if (name.startsWith(filter.toLowerCase())) { return true; } return false; } }; filter.bind(store); adminMenu.addStyleName("x-small-editor"); adminMenu.add(filter); adminMenu.add(tree); */ /* // test TreeStore<ModelData> store = new TreeStore<ModelData>(); TreePanel<ModelData> tree = new TreePanel<ModelData>(store); tree.setDisplayProperty("name"); ModelData m = newItem("ČÍSELNÍKY", null); store.add(m, false); store.add(m, newItem("Ridici", "user"), false); store.add(m, newItem("Vozidla", "user-girl"), false); ; tree.setExpanded(m, true); m = newItem("UŽÍVATELIA", null); store.add(m, false); store.add(m, newItem("Užívatelia", "user-girl"), false); store.add(m, newItem("Role", "user-girl"), false); tree.setExpanded(m, true); StoreFilterField filter = new StoreFilterField<ModelData>() { @Override protected boolean doSelect(Store store, ModelData parent, ModelData record, String property, String filter) { // only match leaf nodes //if (record instanceof Folder) { // return false; //} String name = record.get("name"); name = name.toLowerCase(); if (name.startsWith(filter.toLowerCase())) { return true; } return false; } }; filter.bind(store); adminMenu.add(filter); // filter //filter.setWidth("20"); //filter.setWidth(cp.getWidth(true)); adminMenu.add(tree); // strom // end of test */ /* // xxx service = (DatabaseServiceAsync) Registry.get(Agdoprava.SERVICE); service.getAdministraceFolders("xxx yyy zzz", new AsyncCallback<Folder>() { public void onFailure(Throwable caught) { System.out.println("AppController.onInit.getAdministraceFolders.onFailure"); Dispatcher.forwardEvent(AppEvents.Error, caught); } public void onSuccess(Folder result) { System.out.println("AppController.onInit.getAdministraceFolders.onSuccess"); Dispatcher.forwardEvent(AppEvents.NavAdministrace, result); } }); loader = new BaseTreeLoader<Folder>(new TreeModelReader<List<Folder>>()); store = new TreeStore<Folder>(loader); tree = new TreePanel<Folder>(store); tree.getStyle().setLeafIcon(IconHelper.createStyle("tree-folder")); tree.setDisplayProperty("name"); tree.setAutoSelect(true); tree.getSelectionModel().addSelectionChangedListener( new SelectionChangedListener<Folder>() { @Override public void selectionChanged(SelectionChangedEvent<Folder> se) { Folder f = (Folder) se.getSelection().get(0); AppEvent evt = new AppEvent(AppEvents.ViewZakazkaItems, f); fireEvent(evt); } }); adminMenu.add(tree); // xxx */ ContentPanel west = (ContentPanel) Registry.get(AppView.WEST_PANEL); west.add(adminMenu); }
DatabaseService.javaCode:public Folder getAdministraceFolders() { Folder[] folders = new Folder[] { new Folder("Beethoven", new Folder[] { new Folder("Quartets", new Folder[] { new Folder("Six String Quartets"), new Folder("Three String Quartets"), new Folder("Grosse Fugue for String Quartets"),}), new Folder("Sonatas", new Folder[] { new Folder("Sonata in A Minor"), new Folder("Sonata in F Major"),}), new Folder("Concertos", new Folder[] { new Folder("No. 1 - C"), new Folder("No. 2 - B-Flat Major"), new Folder("No. 3 - C Minor"), new Folder("No. 4 - G Major"), new Folder("No. 5 - E-Flat Major"),}), new Folder("Symphonies", new Folder[] { new Folder("No. 1 - C Major"), new Folder("No. 2 - D Major"), new Folder("No. 3 - E-Flat Major"),}),}), new Folder("Brahms", new Folder[] { new Folder("Concertos", new Folder[] { new Folder("Violin Concerto"), new Folder("Double Concerto - A Minor"), new Folder("Piano Concerto No. 1 - D Minor"), new Folder("Piano Concerto No. 2 - B-Flat Major"),}), new Folder("Quartets", new Folder[] { new Folder("Piano Quartet No. 1 - G Minor"), new Folder("Piano Quartet No. 2 - A Major"), new Folder("Piano Quartet No. 3 - C Minor"), new Folder("String Quartet No. 3 - B-Flat Minor"),}), new Folder("Sonatas", new Folder[] { new Folder("Two Sonatas for Clarinet - F Minor"), new Folder("Two Sonatas for Clarinet - E-Flat Major"),}), new Folder("Symphonies", new Folder[] { new Folder("No. 1 - C Minor"), new Folder("No. 2 - D Minor"), new Folder("No. 3 - F Major"), new Folder("No. 4 - E Minor"),}),}), new Folder("Mozart", new Folder[] {new Folder("Concertos", new Folder[] { new Folder("Piano Concerto No. 12"), new Folder("Piano Concerto No. 17"), new Folder("Clarinet Concerto"), new Folder("Violin Concerto No. 5"), new Folder("Violin Concerto No. 4"),}),}),}; Folder root = new Folder("root"); for (int i = 0; i < folders.length; i++) { root.add((Folder) folders[i]); } return root; }
and DatabaseServiceAsync.javaCode:public Folder getAdministraceFolders();
I tried to implement code from available examples, but unfortunately I'm missing something.Code:public void getAdministraceFolders(AsyncCallback<Folder> callback);
Folder.java
Many thanks,Code:/* * Ext GWT 2.2.0 - Ext for GWT * Copyright(c) 2007-2010, Ext JS, LLC. * licensing@extjs.com * * http://extjs.com/license */ package com.agtransport.agdoprava.client.model; import java.io.Serializable; import com.extjs.gxt.ui.client.data.BaseTreeModel; public class Folder extends BaseTreeModel implements Serializable { private static int ID = 0; public Folder() { set("id", ID++); } public Folder(String name) { set("id", ID++); set("name", name); } public Folder(String name, BaseTreeModel[] children) { this(name); for (int i = 0; i < children.length; i++) { add(children[i]); } } public Integer getId() { return (Integer) get("id"); } public String getName() { return (String) get("name"); } public String toString() { return getName(); } }
Tomas
-
26 Oct 2010 6:44 AM #2
I dont understand your code. Your service just fires an event but nothing in your code listens for that event. Please try to post your code in a small and standalone testcase that implements EntryPoint
-
26 Oct 2010 7:51 AM #3
Sorry, I forgot to post files which invokes whole process:
Main class with entry point:
This invokes "new AdministraceController()" from AdministraceController .javaCode:package com.agtransport.agdoprava.client; //import org.elsys.project.client.administration.AdminArticleAdd; //import org.elsys.project.client.administration.AdminArticleEdit; //import org.elsys.project.client.administration.AdminArticlesList; //import org.elsys.project.client.administration.AdminCategoriesAdd; //import org.elsys.project.client.administration.AdminCategoriesList; //import org.elsys.project.client.administration.AdminCategoryEdit; //import org.elsys.project.client.administration.AdminCommentsList; //import org.elsys.project.client.administration.AdminCreate; //import org.elsys.project.client.administration.AdminDashboard; import com.agtransport.agdoprava.client.LoginScreen; //import org.elsys.project.client.administration.AdminLogout; //import org.elsys.project.client.administration.AdminSettings; import com.agtransport.agdoprava.client.DatabaseService; import com.agtransport.agdoprava.client.DatabaseServiceAsync; import com.agtransport.agdoprava.client.controller.*; import com.extjs.gxt.ui.client.GXT; import com.extjs.gxt.ui.client.Registry; import com.extjs.gxt.ui.client.mvc.Dispatcher; import com.extjs.gxt.ui.client.util.Theme; import com.google.gwt.core.client.EntryPoint; import com.google.gwt.core.client.GWT; import com.google.gwt.user.client.rpc.ServiceDefTarget; import com.google.gwt.event.logical.shared.ValueChangeEvent; import com.google.gwt.event.logical.shared.ValueChangeHandler; import com.google.gwt.user.client.Cookies; import com.google.gwt.user.client.History; import com.google.gwt.user.client.Window; import com.google.gwt.user.client.rpc.AsyncCallback; import com.google.gwt.user.client.ui.RootPanel; /** * Entry point classes define <code>onModuleLoad()</code>. */ public class Agdoprava implements EntryPoint { public static final String SERVICE = "DatabaseService"; private String [] params; public void onModuleLoad() { GXT.setDefaultTheme(Theme.GRAY, true); DatabaseServiceAsync service = (DatabaseServiceAsync) GWT.create(DatabaseService.class); ServiceDefTarget endpoint = (ServiceDefTarget) service; String moduleRelativeURL = SERVICE; endpoint.setServiceEntryPoint(moduleRelativeURL); Registry.register(SERVICE, service); Dispatcher dispatcher = Dispatcher.get(); dispatcher.addController(new AppController()); dispatcher.addController(new ZakazkaController()); dispatcher.addController(new TaskController()); dispatcher.addController(new AdministraceController()); dispatcher.dispatch(AppEvents.Login); GXT.hideLoadingPanel("loading"); } }
where AdministraceFolderView.javaCode:package com.agtransport.agdoprava.client.controller; import com.agtransport.agdoprava.client.AppEvents; import com.extjs.gxt.ui.client.event.EventType; import com.extjs.gxt.ui.client.mvc.AppEvent; import com.extjs.gxt.ui.client.mvc.Controller; public class AdministraceController extends Controller { private AdministraceFolderView folderView; private AdministraceView adminView; public AdministraceController() { registerEventTypes(AppEvents.Init); registerEventTypes(AppEvents.NavAdministrace); } @Override public void initialize() { super.initialize(); folderView = new AdministraceFolderView(this); adminView = new AdministraceView(this); } @Override public void handleEvent(AppEvent event) { EventType type = event.getType(); if (type == AppEvents.Init) { forwardToView(folderView, event); } else if (type == AppEvents.NavAdministrace) { forwardToView(adminView, event); } } }
Other files were posted in first post.Code:/* * Ext GWT 2.2.0 - Ext for GWT * Copyright(c) 2007-2010, Ext JS, LLC. * licensing@extjs.com * * http://extjs.com/license */ package com.agtransport.agdoprava.client.controller; import com.agtransport.agdoprava.client.Agdoprava; import com.agtransport.agdoprava.client.AppEvents; import com.agtransport.agdoprava.client.DatabaseService; import com.agtransport.agdoprava.client.DatabaseServiceAsync; import com.agtransport.agdoprava.client.model.Folder; import com.agtransport.agdoprava.server.DatabaseServiceImpl; import com.extjs.gxt.ui.client.Registry; import com.extjs.gxt.ui.client.binder.TreeBinder; import com.extjs.gxt.ui.client.data.BaseTreeLoader; import com.extjs.gxt.ui.client.data.BaseModelData; import com.extjs.gxt.ui.client.data.LoadEvent; import com.extjs.gxt.ui.client.data.Loader; import com.extjs.gxt.ui.client.data.ModelStringProvider; import com.extjs.gxt.ui.client.data.RpcProxy; import com.extjs.gxt.ui.client.data.TreeLoader; import com.extjs.gxt.ui.client.data.TreeModel; import com.extjs.gxt.ui.client.data.TreeModelReader; import com.extjs.gxt.ui.client.data.ModelData; import com.extjs.gxt.ui.client.event.ComponentEvent; import com.extjs.gxt.ui.client.event.Events; import com.extjs.gxt.ui.client.event.Listener; import com.extjs.gxt.ui.client.event.LoadListener; import com.extjs.gxt.ui.client.mvc.AppEvent; import com.extjs.gxt.ui.client.mvc.Controller; import com.extjs.gxt.ui.client.mvc.Dispatcher; import com.extjs.gxt.ui.client.mvc.View; import com.extjs.gxt.ui.client.store.Store; import com.extjs.gxt.ui.client.store.StoreSorter; import com.extjs.gxt.ui.client.store.TreeStore; import com.extjs.gxt.ui.client.widget.ContentPanel; import com.extjs.gxt.ui.client.widget.form.StoreFilterField; import com.extjs.gxt.ui.client.widget.tree.Tree; import com.extjs.gxt.ui.client.widget.tree.TreeItem; import com.extjs.gxt.ui.client.widget.treepanel.TreePanel; import com.google.gwt.core.client.GWT; import com.google.gwt.user.client.rpc.AsyncCallback; public class AdministraceFolderView extends View { private ContentPanel adminMenu; DatabaseServiceAsync service; private TreeStore<Folder> store; private TreePanel<Folder> tree; private TreeLoader<Folder> loader; public AdministraceFolderView(Controller controller) { super(controller); } @Override protected void initialize() { } protected void initUI() { adminMenu = new ContentPanel(); adminMenu.setHeading("Administrace"); adminMenu.setAnimCollapse(false); adminMenu.addListener(Events.Expand, new Listener<ComponentEvent>() { public void handleEvent(ComponentEvent be) { Dispatcher.get().dispatch(AppEvents.NavAdministrace); } }); final DatabaseServiceAsync service = (DatabaseServiceAsync) GWT.create(DatabaseService.class); //service = (DatabaseServiceAsync) Registry.get(Agdoprava.SERVICE); // data proxy RpcProxy proxy = new RpcProxy() { @Override protected void load(Object loadConfig, AsyncCallback callback) { service.getAdministraceFolders(callback); } }; // tree loader TreeLoader loader = new BaseTreeLoader(proxy) { @Override public boolean hasChildren(ModelData parent) { return parent instanceof Folder; } }; // trees store TreeStore<Folder> store = new TreeStore<Folder>(loader); /* store.setStoreSorter(new StoreSorter<Folder>() { @Override public int compare(Store store, Folder m1, Folder m2, String property) { boolean m1Folder = m1 instanceof Folder; boolean m2Folder = m2 instanceof Folder; if (m1Folder && !m2Folder) { return -1; } else if (!m1Folder && m2Folder) { return 1; } return super.compare(store, m1, m2, property); } }); */ Tree tree = new Tree(); TreeBinder<Folder> binder = new TreeBinder<Folder>(tree, store); /* binder.setIconProvider(new ModelStringProvider<Folder>() { public String getStringValue(Folder model, String property) { if (!(model instanceof Folder)) { String ext = model.getName().substring(model.getName().lastIndexOf(".") + 1); // new feature, using image paths rather than style names if ("xml".equals(ext)) { return "images/icons/page_white_code.png"; } else if ("java".equals(ext)) { return "images/icons/page_white_cup.png"; } else if ("html".equals(ext)) { return "images/icons/html.png"; } else { return "images/icons/page_white.png"; } } return null; } }); */ binder.setDisplayProperty("name"); loader.load(null); adminMenu.addText("<div style='font-size: 12px;padding-bottom: 8px'>Tree which loads its children on demand using a remote service.</div>"); adminMenu.add(tree); /* Tree tree = new Tree(); TreeLoader loader = new BaseTreeLoader(new TreeModelReader()); TreeStore<ModelData> store = new TreeStore<ModelData>(loader); TreeBinder binder = new TreeBinder(tree, store); binder.setAutoLoad(true); binder.setDisplayProperty("name"); binder.setIconProvider(new ModelStringProvider() { public String getStringValue(ModelData model, String property) { if (((TreeModel) model).isLeaf()) { return "icon-music"; } return null; } }); service = (DatabaseServiceAsync) Registry.get(Agdoprava.SERVICE); service.getAdministraceFolders("xxx yyy zzz", new AsyncCallback<Folder>() { public void onFailure(Throwable caught) { System.out.println("AdministraceFolderView.onInit.getAdministraceFolders.onFailure"); Dispatcher.forwardEvent(AppEvents.Error, caught); } public void onSuccess(Folder result) { System.out.println("AdministraceFolderView.onInit.getAdministraceFolders.onSuccess"); Dispatcher.forwardEvent(AppEvents.NavAdministrace, result); } }); StoreFilterField filter = new StoreFilterField<ModelData>() { @Override protected boolean doSelect(Store store, ModelData parent, ModelData record, String property, String filter) { // only match leaf nodes if (record instanceof Folder) { return false; } String name = record.get("name"); name = name.toLowerCase(); if (name.startsWith(filter.toLowerCase())) { return true; } return false; } }; filter.bind(store); adminMenu.addStyleName("x-small-editor"); adminMenu.add(filter); adminMenu.add(tree); */ /* // test TreeStore<ModelData> store = new TreeStore<ModelData>(); TreePanel<ModelData> tree = new TreePanel<ModelData>(store); tree.setDisplayProperty("name"); ModelData m = newItem("ČÍSELNÍKY", null); store.add(m, false); store.add(m, newItem("Ridici", "user"), false); store.add(m, newItem("Vozidla", "user-girl"), false); ; tree.setExpanded(m, true); m = newItem("UŽÍVATELIA", null); store.add(m, false); store.add(m, newItem("Užívatelia", "user-girl"), false); store.add(m, newItem("Role", "user-girl"), false); tree.setExpanded(m, true); StoreFilterField filter = new StoreFilterField<ModelData>() { @Override protected boolean doSelect(Store store, ModelData parent, ModelData record, String property, String filter) { // only match leaf nodes //if (record instanceof Folder) { // return false; //} String name = record.get("name"); name = name.toLowerCase(); if (name.startsWith(filter.toLowerCase())) { return true; } return false; } }; filter.bind(store); adminMenu.add(filter); // filter //filter.setWidth("20"); //filter.setWidth(cp.getWidth(true)); adminMenu.add(tree); // strom // end of test */ /* // xxx service = (DatabaseServiceAsync) Registry.get(Agdoprava.SERVICE); service.getAdministraceFolders("xxx yyy zzz", new AsyncCallback<Folder>() { public void onFailure(Throwable caught) { System.out.println("AppController.onInit.getAdministraceFolders.onFailure"); Dispatcher.forwardEvent(AppEvents.Error, caught); } public void onSuccess(Folder result) { System.out.println("AppController.onInit.getAdministraceFolders.onSuccess"); Dispatcher.forwardEvent(AppEvents.NavAdministrace, result); } }); loader = new BaseTreeLoader<Folder>(new TreeModelReader<List<Folder>>()); store = new TreeStore<Folder>(loader); tree = new TreePanel<Folder>(store); tree.getStyle().setLeafIcon(IconHelper.createStyle("tree-folder")); tree.setDisplayProperty("name"); tree.setAutoSelect(true); tree.getSelectionModel().addSelectionChangedListener( new SelectionChangedListener<Folder>() { @Override public void selectionChanged(SelectionChangedEvent<Folder> se) { Folder f = (Folder) se.getSelection().get(0); AppEvent evt = new AppEvent(AppEvents.ViewZakazkaItems, f); fireEvent(evt); } }); adminMenu.add(tree); // xxx */ ContentPanel west = (ContentPanel) Registry.get(AppView.WEST_PANEL); west.add(adminMenu); } private TreeItem newItem(String text, String iconStyle) { TreeItem item = new TreeItem(text); item.setIconStyle(iconStyle); return item; } @Override protected void handleEvent(AppEvent event) { if (event.getType() == AppEvents.Init) { initUI(); } else if (event.getType() == AppEvents.NavAdministrace) { Folder f = event.getData(); if (f != null) { loader.addListener(Loader.Load, new LoadListener() { @Override public void loaderLoad(LoadEvent le) { loader.removeLoadListener(this); } }); loader.load(f); } } } }
Thanks,
Tomas
-
28 Oct 2010 8:28 AM #4
Similar Threads
-
asynctree - auto load
By diegolovison in forum Ext GWT: DiscussionReplies: 4Last Post: 1 Apr 2010, 6:07 AM -
Extjs .net AsyncTree example!
By Extjsshao in forum Ext 2.x: Help & DiscussionReplies: 13Last Post: 2 Sep 2008, 12:10 AM -
Ext JS , AsyncTree
By speedytangent in forum Ext 2.x: Help & DiscussionReplies: 1Last Post: 5 Jun 2008, 3:26 AM -
AsyncTree error
By davtrasher in forum Ext GWT: Help & Discussion (1.x)Replies: 0Last Post: 3 Jun 2008, 4:36 AM -
AsyncTree: adding onClick
By erfaan in forum Ext 1.x: Help & DiscussionReplies: 3Last Post: 28 May 2007, 3:09 AM


Reply With Quote