How can I add an image column to a table in wicket framework?_问答_开发者

I want to add a column containing images in each cell of a table in wicket framework. I make the table in a java class and have a createColumns() method as the following:

private List<IColumn> createColumns() {
    List<IColumn> columns = new ArrayList<IColumn>();
    // Create the columns that will be displayed, second param is the sort
    // order
    // Use column position for aggregate functions
    // Otherwise the query uses column aliases so these need to match here

    columns.add(new PropertyColumn(new Model("Status"), "code") {
        private static final long serialVersionUID = 1L;
        @Override
        public void populateItem(Item item, String componentId, IModel model) {
            Object[] values = ((ArrayWrapper) model.getObject()).getArray();
            setStatus((Integer) values[0]);
            item.add(new Image(componentId, new ResourceReference(this.getClass(), getStatus())));
        }
    });

    columns.add(new PropertyColumn(new Model("First"), "2", "array[1]"));
    columns.add(new PropertyColumn(new Model(开发者_如何转开发"Last"), "3", "array[2]"));        
    columns.add(new PropertyColumn(new Model("Sender"), "sender",
            "array[4]"));
    columns.add(new PropertyColumn(new Model("Receiver"), "receiver",
            "array[5]"));

    columns.add(new HeaderlessColumn() {
        private static final long serialVersionUID = 1L;

        public void populateItem(Item cellItem, String componentId,
                IModel rowModel) {
            cellItem.add(new ActionPanel(componentId, rowModel));
        };
    });

    return columns;
}

The html file is simply as the following:

<html xmlns:wicket="http://wicket.sourceforge.net/">
<body>
<wicket:extend>
 <table align="center" wicket:id="results"></table>
</wicket:extend>
</body>
</html>

But I get an exception which is:

org.apache.wicket.markup.MarkupException: Component cell must be applied to a tag of type 'img', not '' (line 0, column 0)

And it's related to the lines that I make the column for image. Can anyone help me how I can make it?

Use an AbstractColumn instead of a PropertyColumn. PropertyColumn is suitable if you only need to specify a property name, as you would do with a PropertyModel.

From this discussion in the Wicket users list, DataTable outputs this markup:

<tbody> 
  <tr wicket:id="rows"> 
    <td wicket:id="cells"> 
      <span wicket:id="cell">[cell]</span> 
    </td> 
  </tr> 
</tbody>

Note that IColumn implements ICellPopulator, and it is ICellPopulator#populateItem() that is overriden in AbstractColumn.

So, whatever you come up with in populateItem should be ok if associated with a <span> in markup. PropertyColumn might be doing it with a Label, and you should be fine adding a custom Panel or WebMarkupContainer which will contain your Image.

This is a slightly related question: How do you make a link inside a PropertyColumn in Wicket?

The code in CreateColumns method is as the following:

   columns.add(new PropertyColumn(new Model("Status"), "code") {
        private static final long serialVersionUID = 1L;
        @Override
        public void populateItem(Item item, String componentId, IModel model) {
            Object[] values = ((ArrayWrapper) model.getObject()).getArray();
            setStatus((Integer) values[0]);
            item.add(new ImagePanel(componentId, new ResourceReference(SearchResults.class, getStatus())));
        }
    });

And this is the ImagePanel:

 public class ImagePanel extends Panel {
    private static final long serialVersionUID = 1L;
    /**
     * @param id
     */
    public ImagePanel(String id, ResourceReference image) {
        super(id);
        add(new Image("status", image));
    }
}

The html code for the panel is:

<html xmlns:wicket="http://wicket.sourceforge.net/">
<body>
<wicket:panel>
<img wicket:id="status"/>
</wicket:panel>
</body>
</html>

How can I add an image column to a table in wicket framework?

精彩评论

关注公众号

热门标签

图文推荐

How can I add an image column to a table in wicket framework?

更多 问答 相关资讯：

精彩评论

关注公众号

热门标签

图文推荐

更多问答相关资讯：