wicketモーダルのヘッダを更新するには<T>

Question

私は改札を使ってページを作っています。 メインページは、請求書情報を表示するテーブルで構成されています。 表の最後の列には、各請求書のリンクがあり、その請求書の完全な情報が表示されます。 私はde.agilecoders.wicket.core.markup.html.bootstrap.dialog.Modalを使用しています

私の目標は私がモーダルを開くと、モーダルのヘッダーが開かれたインボイスの請求書番号を示しています。

私はページを更新した後にしか入手できません。別の請求書のモーダルを開くと、ヘッダーは更新されず、前の請求書の番号が表示されます。私は再びページを更新する必要があります。

ヘッダーにページを更新せずにそれぞれの請求書の番号を示すモーダルを開く方法がわかりません。

メインページのマークアップの下にあります。

<wicket:extend> 
     <div class="page-header"> 
      <h2> 
       <wicket:message key="invoices-welcome">[Welcome message]</wicket:message> 
      </h2> 
     </div> 
     <div> 
      <span wicket:id="navigator">[dataview navigator]</span> 
     </div> 
     <div> 
      <table cellspacing="0" class="table table-condensed"> 
       <tr> 
        <th>Status</th> 
        <th>Invoice number</th> 
        <th>Supplier</th> 
        <th>Customer</th> 
        <th>Amount</th> 
        <th>Actions</th> 
       </tr> 
       <tr wicket:id="rows"> 
        <td><span wicket:id="status">[status]</span></td> 
        <td><span wicket:id="invoiceN">[invoiceN]</span></td> 
        <td><span wicket:id="supplier">[supplier]</span></td> 
        <td><span wicket:id="customer">[customer]</span></td> 
        <td><span wicket:id="amount">[amount]</span></td> 
        <td><a wicket:id="showModal">View</a></td> 
       </tr> 
      </table> 
     </div> 
     <div wicket:id="modal"></div> 
    </wicket:extend> 

メインページのJavaコード

package nl.riskco.liberobc.web.pages.invoices; 

import java.util.List; 

import org.apache.wicket.ajax.AjaxRequestTarget; 
import org.apache.wicket.ajax.markup.html.AjaxLink; 
import org.apache.wicket.markup.html.basic.Label; 
import org.apache.wicket.markup.html.navigation.paging.PagingNavigator; 
import org.apache.wicket.markup.repeater.Item; 
import org.apache.wicket.markup.repeater.data.DataView; 
import org.apache.wicket.markup.repeater.data.ListDataProvider; 
import org.apache.wicket.model.IModel; 
import org.apache.wicket.model.Model; 
import org.apache.wicket.request.mapper.parameter.PageParameters; 

import nl.riskco.liberobc.client.business.model.InvoiceDomain; 
import nl.riskco.liberobc.client.business.services.IInvoiceService; 
import nl.riskco.liberobc.client.business.services.InvoiceServiceMocked; 
import nl.riskco.liberobc.web.pages.BasePage; 

//@AuthorizeInstantiation("VIEWER") 
public class InvoicesPage extends BasePage { 
    private static final long serialVersionUID = 1L; 
    private InvoiceModalAgile modal2; 

    public InvoicesPage(PageParameters parameters) { 
    super(parameters); 

    IInvoiceService service = new InvoiceServiceMocked(); 
    List<InvoiceDomain> invoicesToTest2; 
    invoicesToTest2 =service.getInvoices(1, 30); 

    modal2 = new InvoiceModalAgile("modal", Model.of(new InvoiceDomain())); 
    modal2.addCloseButton(); 
    modal2.setOutputMarkupId(true); 
    add(modal2); 

    DataView<InvoiceDomain> dataview = new DataView<InvoiceDomain>("rows", 
      new ListDataProvider<InvoiceDomain>(invoicesToTest2)) { 

     private static final long serialVersionUID = 1L; 

     @Override 
     protected void populateItem(Item<InvoiceDomain> item) { 

      // TODO Auto-generated method stub 
      InvoiceDomain invoice = item.getModelObject(); 

      item.add(new Label("status", invoice.getStatus())); 
      item.add(new Label("invoiceN", String.valueOf(invoice.getInvoiceGUID()))); 
      item.add(new Label("supplier", invoice.getSupplier())); 
      item.add(new Label("customer", invoice.getCustomer())); 
      item.add(new Label("amount", String.valueOf(invoice.getAmount()))); 

      item.add(new AjaxLink("showModal") { 
       private static final long serialVersionUID = 1L; 

       @Override 
       public void onClick(AjaxRequestTarget target) { 
        modal2.setInvoiceModel(Model.of(invoice), target); 
        modal2.show(target); 
       } 
      }); 
     } 
    }; 

    dataview.setItemsPerPage(10L); 
    add(dataview); 
    add(new PagingNavigator("navigator", dataview)); 
} 

@Override 
protected void onDetach() { 
    // TODO Auto-generated method stub 
    super.onDetach(); 
} 

} 

モーダル

のモーダル

<wicket:extend> 
<div class="panel panel-default"> 
    <div class="panel-heading">Invoice details</div> 
    <div class="panel-body"> 
     <table class="table table-bordered"> 
      <tr> 
       <th><wicket:message key="invoice-id">[invoice-id]</wicket:message></th> 
       <td><div wicket:id="invoiceN"></div></td> 
      </tr> 
      <tr> 
       <th><wicket:message key="invoice-status">[invoice-status]</wicket:message></th> 
       <td><div wicket:id="status"></div></td> 
      </tr> 
      <tr> 
       <th><wicket:message key="invoice-customer">[invoice-customer]</wicket:message></th> 
       <td><div wicket:id="customer"></div></td>    
      </tr> 
      <tr> 
       <th><wicket:message key="invoice-supplier">[invoice-supplier]</wicket:message></th> 
       <td><div wicket:id="supplier"></div></td> 
      </tr> 
      <tr> 
       <th><wicket:message key="invoice-ibanSupplier">[invoice-ibanSupplier]</wicket:message></th> 
       <td><div wicket:id="iban"></div></td> 
      </tr> 
      <tr> 
       <th><wicket:message key="invoice-amount">[invoice-amount]</wicket:message></th> 
       <td><div wicket:id="amount"></div></td> 
      </tr> 
      <tr> 
       <th>Approved</th> 
       <td><form wicket:id="form"><input type="checkbox" wicket:id="checkbox1"></form></td> 
      </tr> 
      <tr> 
       <th>Early payment</th> 
       <td><form wicket:id="form2"><input type="checkbox" wicket:id="checkbox2"></form></td> 
      </tr> 
      <tr> 
       <th>Paid (by customer)</th> 
       <td><form wicket:id="form3"><input type="checkbox" wicket:id="checkbox3"></form></td> 
      </tr> 
     </table> 
    </div> 
</div> 
</wicket:extend> 

Javaコードのマークアップ

package nl.riskco.liberobc.web.pages.invoices; import org.apache.wicket.ajax.AjaxRequestTarget; import org.apache.wicket.markup.html.WebMarkupContainer; import org.apache.wicket.markup.html.basic.Label; import org.apache.wicket.markup.html.form.CheckBox; import org.apache.wicket.markup.html.form.Form; import org.apache.wicket.model.IModel; import org.apache.wicket.model.Model; import org.apache.wicket.model.StringResourceModel; import de.agilecoders.wicket.core.markup.html.bootstrap.behavior.BootstrapResourcesBehavior; import de.agilecoders.wicket.core.markup.html.bootstrap.dialog.Modal; import nl.riskco.liberobc.client.business.model.InvoiceDomain; public class InvoiceModalAgile extends Modal<InvoiceDomain>{ private static final long serialVersionUID = 1L; private Label labelGuid; private Label status; private Label customer; private Label iban; private Label amountLabel; private Label supplierLabel; private CheckBox approved; private CheckBox earlyPayment; private CheckBox customerPaid; private Form form; private Form form2; private Form form3; private WebMarkupContainer header; private WebMarkupContainer footer; public InvoiceModalAgile(String id , IModel<InvoiceDomain> model) { super(id, model); add(form = new Form<>("form")); add(form2 = new Form<>("form2")); add(form3 = new Form<>("form3")); status = (new Label("status",model.getObject().getStatus())); status.setOutputMarkupId(true); add(status); supplierLabel = (new Label("supplier",model.getObject().getSupplier())); supplierLabel.setOutputMarkupId(true); add(supplierLabel); labelGuid = new Label("invoiceN",model.getObject().getInvoiceGUID()); labelGuid.setOutputMarkupId(true); add(labelGuid); customer = (new Label("customer",model.getObject().getCustomer())); customer.setOutputMarkupId(true); add(customer); iban = new Label("iban",model.getObject().getIBANsupplier()); iban.setOutputMarkupId(true); add(iban); amountLabel = new Label("amount",model.getObject().getAmount()); amountLabel.setOutputMarkupId(true); add(amountLabel); approved = new CheckBox("checkbox1"); approved.setOutputMarkupId(true); approved.setEnabled(false); add(approved); form.setOutputMarkupId(true); add(form); form.add(approved); earlyPayment = new CheckBox("checkbox2"); earlyPayment.setOutputMarkupId(true); earlyPayment.setEnabled(false); add(earlyPayment); form2.setOutputMarkupId(true); add(form2); form2.add(earlyPayment); customerPaid = new CheckBox("checkbox3"); customerPaid.setOutputMarkupId(true); customerPaid.setEnabled(false); add(customerPaid); form3.setOutputMarkupId(true); add(form3); form3.add(customerPaid); BootstrapResourcesBehavior.addTo(this); } public void setInvoiceModel(IModel<InvoiceDomain> invoice, AjaxRequestTarget target){ this.labelGuid.setDefaultModel(Model.of(invoice.getObject().getInvoiceGUID())); target.add(labelGuid); this.amountLabel.setDefaultModel(Model.of(invoice.getObject().getAmount())); target.add(amountLabel); this.status.setDefaultModel(Model.of(invoice.getObject().getStatus())); target.add(status); this.customer.setDefaultModel(Model.of(invoice.getObject().getCustomer())); target.add(customer); this.supplierLabel.setDefaultModel(Model.of(invoice.getObject().getSupplier())); target.add(supplierLabel); this.iban.setDefaultModel(Model.of(invoice.getObject().getIBANsupplier())); target.add(iban); this.approved.setDefaultModel(Model.of(invoice.getObject().getApprovedFlag())); target.add(approved); this.earlyPayment.setDefaultModel(Model.of(invoice.getObject().getOptForEarlyPaymentFlag())); target.add(earlyPayment); this.customerPaid.setDefaultModel(Model.of(invoice.getObject().getHasCustomerPaidFlag())); target.add(customerPaid); this.header(Model.of(String.valueOf(invoice.getObject().getInvoiceGUID()))); } @Override protected void onDetach() { // TODO Auto-generated method stub super.onDetach(); } } 

Answer 1

問題は、モーダル構築で渡す空のモデルのモデルオブジェクトを使用することです。プロパティの動的モデルを使用する必要があります。

静的/シンプルモデル：ここで

label = new Label("staticValue", personModel.getObject().getName()); 

ラベルは、各レンダリングのために、現在の人の名前を使用します。

ダイナミックモデル：

label = new Label("staticValue", new AbstractReadOnlyModel<String>() { 

    @Override public String getObject() { 
     return personModel.getObject().getName()); 
    } 
} 

あなたは、動的バージョンを遅延personModelの名前を読み取り、それがラベルの各レンダリング時に呼び出されることがわかります。この方法では、ラベルのモデルに新しいPersonを入れても、人の名前が読み取られます。より多くの情報の読み取りについて

status = new Label("status", new PropertyModel(this, "model.object.status")); 

：