3

我将一些数据输入到我的 propertyListview 中,周围有一个容器,但是当我想用 Ajax 更新它时,它什么也没做!如何使用 Ajax 更新我的 PropertyListview?

在后台编辑 我使用 JSON Parse 解析来自气象站的数据,该数据可以改变很多,所以我想更新 propertyListview 中的数据

public class WeerPanel extends Panel {

public WeerPanel(String id) throws IOException {
    super(id);

    final WeerService weerService = new WeerServiceImpl();

    PropertyListView<Weer> newview = new PropertyListView<Weer>("weer", weerService.getWeer()) {

        @Override
        protected void populateItem(ListItem<Weer> item) {
            item.add(new Label("temperatuur"));
            item.add(new StaticImage("type", String.format("images/%s.png", item.getModelObject().getType())));
            item.add(new Label("omschrijving"));
        }
    };

    final WeerVoorspellingService weerVoorspellingService = new WeerVoorspellingServiceImpl();

    PropertyListView<WeerVoorspelling> hateView = new PropertyListView<WeerVoorspelling>("weersvoorspelling", weerVoorspellingService.getWeerVoorspelling()) {

        @Override
        protected void populateItem(ListItem<WeerVoorspelling> item) {
            item.add(new Label("dag"));
            item.add(new StaticImage("typeVoorspelling", String.format("images/%s.png", item.getModelObject().getType())));
            item.add(new Label("minTemperatuur"));
            item.add(new Label("maxTemperatuur"));
        }
    };

    final WebMarkupContainer containerWeer = new WebMarkupContainer("containerWeer");
    containerWeer.setOutputMarkupId(true);
    containerWeer.add(hateView);
    containerWeer.add(newview);
    add(containerWeer);

    add(new AbstractAjaxTimerBehavior(Duration.seconds(10)) {

        @Override
        protected final void onTimer(AjaxRequestTarget target) {
            target.add(containerWeer);
        }
    });
}

}

这是我在后台做的一些代码,它是一个虚拟的,每次都会通过一个随机数改变天气的温度。

                Random r = new Random();
            int randomInt = r.nextInt(100);
            weer.add(new Weer("rain", "Mooi bewolkt", randomInt, v.getVoorspellingen()));

虚拟代码很好,但在我的页面上仍然没有任何变化......好像我的列表没有得到任何新数据......

FIXED here 是供人们使用的代码

public class WeerPanel extends Panel {

    public WeerPanel(String id) {

        super(id);

        add(createContainer());

        add(new AbstractAjaxTimerBehavior(Duration.seconds(10)) {
            @Override
            protected final void onTimer(AjaxRequestTarget target) {
                target.add(createContainer());
            }
        });
    }

    private final WebMarkupContainer createContainer() {
        final WeerService weerService = new WeerServiceImpl();

        PropertyListView<Weer> newview = null;
        try {
            newview = new PropertyListView<Weer>("weer", weerService.getWeer()) {

                @Override
                protected void populateItem(ListItem<Weer> item) {
                    item.add(new Label("temperatuur"));
                    item.add(new StaticImage("type", String.format("images/%s.png", item.getModelObject().getType())));
                    item.add(new Label("omschrijving"));
                }
            };
        } catch (Exception e) {
            e.printStackTrace();
        }

        WeerVoorspellingService weerVoorspellingService = new WeerVoorspellingServiceImpl();

        PropertyListView<WeerVoorspelling> hateView = null;
        try {
            hateView = new PropertyListView<WeerVoorspelling>("weersvoorspelling", weerVoorspellingService.getWeerVoorspelling()) {

                @Override
                protected void populateItem(ListItem<WeerVoorspelling> item) {
                    item.add(new Label("dag"));
                    item.add(new StaticImage("typeVoorspelling", String.format("images/%s.png", item.getModelObject().getType())));
                    item.add(new Label("minTemperatuur"));
                    item.add(new Label("maxTemperatuur"));
                }
            };
        } catch (Exception e) {
            e.printStackTrace();
        }

        WebMarkupContainer containerWeer = new WebMarkupContainer("containerWeer");
        containerWeer.setOutputMarkupId(true);
        containerWeer.add(hateView);
        containerWeer.add(newview);
        addOrReplace(containerWeer);

        return containerWeer;
    }
}
4

4 回答 4

1

在您中,onTimer您将对象添加到自身而不更改它。我建议将视图/容器重新生成移动到一种新方法中。

然后onTimer像这样重新定义:

add(new AbstractAjaxTimerBehavior(Duration.seconds(10)) 
{
    @Override
    protected final void onTimer(AjaxRequestTarget target) 
    {   //createContainer() generates the views and container.
        target.add(createContainer()); 
    }
}

编辑:
我会这样定义createContainer()

private WebMarkupContainer createContainer()
{
  final WeerService weerService = new WeerServiceImpl();

  PropertyListView<Weer> newview = new PropertyListView<Weer>("weer", weerService.getWeer()) 
  {

    @Override
    protected void populateItem(ListItem<Weer> item) 
    {
        item.add(new Label("temperatuur"));
        item.add(new StaticImage("type", String.format("images/%s.png", item.getModelObject().getType())));
        item.add(new Label("omschrijving"));
    }
  };

  WeerVoorspellingService weerVoorspellingService = new WeerVoorspellingServiceImpl();

  PropertyListView<WeerVoorspelling> hateView = new PropertyListView<WeerVoorspelling>("weersvoorspelling", weerVoorspellingService.getWeerVoorspelling()) 
  {

    @Override
    protected void populateItem(ListItem<WeerVoorspelling> item) 
    {
        item.add(new Label("dag"));
        item.add(new StaticImage("typeVoorspelling", String.format("images/%s.png", item.getModelObject().getType())));
        item.add(new Label("minTemperatuur"));
        item.add(new Label("maxTemperatuur"));
    }
  };

  WebMarkupContainer containerWeer = new WebMarkupContainer("containerWeer");
  containerWeer.setOutputMarkupId(true);
  containerWeer.add(hateView);
  containerWeer.add(newview);
  add(containerWeer);

  return containerWeer;
}

编辑以匹配最终解决方案

然后像这样定义你的Panel构造函数:

public WeerPanel(String id) throws IOException 
{
  super(id);

  final WebMarkupContainer container = createContainer();

  add(new AbstractAjaxTimerBehavior(Duration.seconds(10)) 
  {
    @Override
    protected final void onTimer(AjaxRequestTarget target) 
    {   //createContainer() generates the views and container.
        container.addOrReplace(createContainer());
    }
  }
}
于 2013-03-12T18:50:17.797 回答
1

你只得到一次“WeerVoorspelling”:

PropertyListView<WeerVoorspelling> hateView
  = new PropertyListView<WeerVoorspelling>("weersvoorspelling",
         weerVoorspellingService.getWeerVoorspelling()) { .. }

因此,无论天气预报如何变化,您的 listView 仍会查看原始列表。你应该引入一个间接:

IModel<List<WeerVoorspelling>> weerVoorspelling = new AbstractReadOnlyModel<List<WeerVoorspelling>> {
  public List<WeerVoorspelling> getObject() {
    return weerVoorspellingService.getWeerVoorspelling();
  }
}

PropertyListView<WeerVoorspelling> hateView
  = new PropertyListView<WeerVoorspelling>("weersvoorspelling",
         weerVoorspelling) { .. }
于 2013-03-13T06:25:49.870 回答
0

请查看 wicket ajax 控制台中的输出,它可能说明无法直接更新列表视图。另外,您可以在更新 Listview 的位置添加代码吗?

于 2013-03-12T16:58:26.370 回答
0

根据文档 AjaxSelfUpdatingTimerBehavior 有一个方法 onTimer()。您需要实现此方法并将希望更新的视图添加到 AjaxRequestTarget。这将刷新您要更新的组件。ajax 事件目前什么都不做,这就是为什么你什么都看不到的原因。

基本上,从高层次的角度来看,您想要更新控制 listView 的后备模型对象,然后当 ajax 计时器触发时,您想要刷新该列表以显示最新数据。

代码看起来像这样:

containerWeer.add(new AjaxSelfUpdatingTimerBehavior(Duration.seconds(5)){
  @Override
  protected final void onTimer(AjaxRequestTarget target) {
    target.addComponent(/The component you wish to refresh/);
  }
});

于 2013-03-12T17:02:44.727 回答