Thanks for your reply. I've already done that, as described in my first mail, but it still doesn't work.
> Date: Wed, 7 Sep 2011 16:37:39 +0200 > From: [email protected] > To: [email protected] > Subject: Re: Replacing the contents of a table with ajax > > Usually, put a container around the table and update the container > through ajax and not the table directly. > > /Robert > > On 09/07/2011 04:22 PM, Werner Riegel wrote: > > > > Hello, > > > > im trying to update the contents of a table, but it doesn't really work. I > > hope you guys can help me with that. > > > > My page looks like the following: > > It has a Form, consisting of a drop down list + an ajaxbutton, and below > > the form is a table. > > After choosing an element from the list and pressing the ajaxbutton, > > a serverside function will be executed that returns a list of > > items/objects. These items should then be displayed in the table. > > That means, that all existing content in the table should be replaced by > > the new items (one item per row) > > Actually all i want is to switch the old table contents with the new ones. > > > > Since i couldnt replace the table itself, i put it in a Panel, which i am > > now replacing when the button is pressed. > > > > > > > > The panel looks like this: > > > > TablePanel.java: > > ----------------------------------------------------------------------------------------------------------------------------- > > public TablePanel(String id, List<MyObject> objectList) { > > super(id); > > > > DataView<MyObject> dataView = new DataView<MyObject>("objects", new > > ListDataProvider<MyObject>(objectList)) { > > > > @Override > > protected void populateItem(Item<MyObject> item) { > > MyObject obj = item.getModelObject(); > > // populate > > } > > }; > > > > dataView.setOutputMarkupId(true); > > add(dataView); > > } > > //TablePanel.java: > > --------------------------------------------------------------------------------------------------------------------------- > > > > > > > > The corresponding html file: > > > > TablePanel.html: > > ----------------------------------------------------------------------------------------------------------------------------- > > <wicket:panel> > > <table id="table-horizontal"> > > > > <thead> > > // header-content > > </thead> > > > > <tfoot> > > </tfoot> > > > > <tbody> > > <tr wicket:id="objects"> > > <td><span wicket:id="itemValueX">[id]</span> </td> > > // etc > > </tr> > > </tbody> > > </table> > > </wicket:panel> > > //TablePanel.html: > > --------------------------------------------------------------------------------------------------------------------------- > > > > > > > > In the onSubmit function i build a new TablePanel object with the id from > > the old tablePanel and with the new list of items that i want to display, > > then add it to the target. > > It looks like this: > > > > AjaxButton: > > ---------------------------------------------------------------------------------------------------------------------------------- > > @Override > > protected void onSubmit(AjaxRequestTarget target, Form<?> form) { > > > > TablePanel tp = new TablePanel(tablePanel.getId(), > > getItemList(selectedFromDropDown)); > > tp.setOutputMarkupId(true); > > target.add(tp); > > } > > //AjaxButton: > > -------------------------------------------------------------------------------------------------------------------------------- > > > > > > > > The page.html in which the TablePanel is inserted contains this markup: > > > > ItemPage.html: > > ------------------------------------------------------------------------------------------------------------------------------- > > <wicket:extend> > > > > <form wicket:id="selectionForm"> > > <select wicket:id="dropDown"> > > <option>[some option]</option> > > </select> > > <input type="submit" wicket:id="selectButton" value="Show Items" /> > > </form> > > > > <span wicket:id="TablePanel">[table content]</span> > > > > </wicket:extend> > > //ItemPage.html: > > ----------------------------------------------------------------------------------------------------------------------------- > > > > > > > > After i press the button, the list of items gets generated and the new > > tablePanel is added to the target, but in the webbrowser i dont see any > > change. > > The populateItem method in the TablePanel's DataView does not get executed > > either. > > > > If i hardcode it, so that the TablePanel just uses a the getItems method - > > ignoring the ajaxbutton + dropbown - the items get displayed in the table > > just fine. > > So that part seems to work OK, i guess it's just something with the ajax. > > But i really don't know what i'm missing. > > > > > > Regards, > > Werner > > --------------------------------------------------------------------- > To unsubscribe, e-mail: [email protected] > For additional commands, e-mail: [email protected] >
