如何在ajaxLink中创建模态实例

时间:2017-07-06 17:05:45

标签: ajax bootstrap-modal wicket

我正在使用AjaxLink打开模态。 这个模式首先显示"你确定"面板,然后是一个面板,其中包含操作结果和关闭按钮。 我关闭模态,如果我再次打开它,我得到第二个面板而不是第一个面板。 我希望每次打开模态以从头开始获取面板序列,即从初始面板开始。 我试图在AjaxLink中实例化模态,但是我遇到了html标记的问题。

HTML

 <wicket:panel>
    <div wicket:id="modal2"></div>
    <button class="btn btn-primary" wicket:id="link"><span 
     wicket:id="buttonLabel"></span></button>
</wicket:panel>

爪哇

  public class ButtonPayment2 extends Panel{

    private static final long serialVersionUID = 1L;

    private Label label;
    private List<String> current;
    private String party;
    private DetailsModal2 modal;
    private String guid;


    @SpringBean
    private Environment env;

    @SpringBean
    private IService service;

    public ButtonPayment2(String componentId, IModel<PaymentDomain> rowmodel, String invoiceId, String paymentId){

    super(componentId);

    current = service.getPById(rowmodel.getObject());
    guid = rowmodel.getObject().getPaymentGUID();
    initiateButton(current);


    modal = new DetailsModal2("modal2",rowmodel,party){
        @Override
        public void closeAction(AjaxRequestTarget target, boolean toPass) {
            super.closeAction(target, toPass);
        }
    };
    modal.header(Model.of("Transaction process"));
    modal.setHeaderVisible(true);
    modal.setOutputMarkupId(true);
    add(modal);

    add(new AjaxLink("link"){

        private static final long serialVersionUID = 1L;

        @Override
        public void onClick(AjaxRequestTarget target) { 

            modal.show(target);     
            target.add(this);

      }//close onclick
   }.add(label));//close ajaxLink

    modal.detach();
 }

}

DetailsModal2.java

public class DetailsModal2 extends Modal<IModel<PaymentDomain>> {

@SpringBean
private IService service;

private String party;
private BootstrapAjaxLink<String> noButton;
private ResponseMessage message;
private String paymentId;
private ProcessingPanel panel2;
private Panel replacedPanel;
private boolean booleanToPass;
private IModel<PaymentDomain> model;


public DetailsModal2(String id, IModel<PaymentDomain> model, String party) {
    super(id);
    this.party = party;
    this.model = model;
    this.paymentId = model.getObject().getGUID();

    replacedPanel = new AreYouSure("replacedPanel");
    replacedPanel.setOutputMarkupId(true);
    add(replacedPanel);

    panel2 = new ProcessingPanel("replacedPanel");

    addButton(new BootstrapAjaxLink<String>("button", null, Buttons.Type.Warning, new ResourceModel("details")) {

        private static final long serialVersionUID = 1L;

        @Override
        public void onClick(AjaxRequestTarget target) {

            addNewPanel(new AjaxLazyLoadPanel("replacedPanel") {
                @Override
                public Component getLazyLoadComponent(String markupId) {
                    if (!condition) {

                        message = service.getPayment(paymentId);

                        if (message == null) {
                            booleanToPass = true;
                            return new VotingResultPanel(markupId, true);
                        } else {
                            return new VotingResultPanel(markupId, false);
                        }
                    } // close if

                    else if (condition)) {

                        message = service.setPayment(paymentId);
                        if (message == null) {
                            booleanToPass = false;
                            return new VotingResultPanel(markupId, true);

                        } else {
                            System.out.println("" + message.getError());
                            return new VotingResultPanel(markupId, false);
                        }
                    }

                    else {
                        System.out.println("It was not possible to access the db");
                    }
                }
            }, target);

            this.setVisible(false);
            target.add(this);
            noButton.setLabel(Model.of("Close"));
            target.add(noButton);

            target.add(this);
        }

    });

    noButton = new BootstrapAjaxLink<String>("button", null, Buttons.Type.Primary) {
        private static final long serialVersionUID = 1L;

        @Override
        public void onClick(AjaxRequestTarget target){
            closeAction(target,booleanToPass);
        }
    }.setLabel(Model.of("No"));
    addButton(noButton);

}

public void closeAction(AjaxRequestTarget target, boolean flag){
    close(target);

}

public void addNewPanel(Panel addpanel, AjaxRequestTarget target) {
    Panel newPanel = null;
    newPanel = addpanel;
    newPanel.setOutputMarkupId(true);
    replacedPanel.replaceWith(newPanel);
    target.add(newPanel);
    replacedPanel = newPanel;
 }
}// close class

DetailsModal2的HTML

 <wicket:extend>    
     <div><span wicket:id="replacedPanel"> </span></div>
 </wicket:extend>

针对此特定案例的新解决方案,DetailsModal2已更改:

 public class DetailsModal2 extends Modal<IModel<PaymentDomain>> {

 @SpringBean
 private IService service;

 private Component noButton;
 private Component yesButton;
 private Component noButton;
 private String paymentId;
 private Panel replacedPanel;
 private IModel<PaymentDomain> model;

 public DetailsModal2(String id, IModel<PaymentDomain> model, String party) 
 {
  super(id);
  this.party = party;
  this.model = model;
  this.paymentId = model.getObject().getPaymentGUID();

  replacedPanel = new AreYouSure("replacedPanel");
  replacedPanel = panel1;
  replacedPanel.setOutputMarkupId(true);
  add(replacedPanel);


  addButton(yesButton = new BootstrapAjaxLink<String>("button", null, Buttons.Type.Warning, new ResourceModel("details")) {

    private static final long serialVersionUID = 1L;

    @Override
    public void onClick(AjaxRequestTarget target) {

        addNewPanel(new AjaxLazyLoadPanel("replacedPanel") {
            @Override
            public Component getLazyLoadComponent(String markupId) {
                if (!condition)) {

                    message = service.getPayment(paymentId);

                    if (message == null) {
                        return new VotingResultPanel(markupId, true);
                    } else 
                    {
                        return new VotingResultPanel(markupId, false);
                    }
                } // close if

                else if (condition)) {

                    message = service.setPayment(paymentId);
                    if (message == null) {
                        return new VotingResultPanel(markupId, true);

                    } else {
                        System.out.println("" + message.getError());
                        return new VotingResultPanel(markupId, false);
                    }
                }

                else {
                    System.out.println("error");
                }
            }
        }, target);

        this.setOutputMarkupPlaceholderTag(true);
        this.setVisible(false);
        noButton.setOutputMarkupPlaceholderTag(true);
        noButton.setVisible(false);
        closeButton.setVisible(true);
        target.add(this, noButton, closeButton);
    }

  });

  noButton = new BootstrapAjaxLink<String>("button", null, Buttons.Type.Primary) {
    private static final long serialVersionUID = 1L;

    @Override
    public void onClick(AjaxRequestTarget target){
        close(target);
    }
}.setLabel(Model.of("No"));
addButton(noButton);

}

 closeButton = new BootstrapAjaxLink<String>("button", null, Buttons.Type.Primary) {
        private static final long serialVersionUID = 1L;

        @Override
        public void onClick(AjaxRequestTarget target){
            addNewPanel(panel1,target);
            yesButton.setOutputMarkupId(true);
            yesButton.setVisible(true);
            noButton.setOutputMarkupId(true);
            noButton.setVisible(true);
            closeButton.setOutputMarkupId(true);
            closeButton.setOutputMarkupPlaceholderTag(true);
            closeButton.setVisible(false);
            target.add(yesButton,noButton,closeButton);
            close(target);

        }
    }.setLabel(Model.of("Close"));
    closeButton.setOutputMarkupPlaceholderTag(true);
    closeButton.setVisible(false);
    addButton(closeButton);
}


 public void addNewPanel(Panel addpanel, AjaxRequestTarget target) {
  Panel newPanel = null;
  newPanel = addpanel;
  newPanel.setOutputMarkupId(true);
  replacedPanel.replaceWith(newPanel);
  target.add(newPanel);
  replacedPanel = newPanel;
 }
}// close class

1 个答案:

答案 0 :(得分:0)

您可以尝试移动以下行

replacedPanel = new AreYouSure("replacedPanel");
replacedPanel.setOutputMarkupId(true);
add(replacedPanel);

onConfigure并将add()更改为addOrReplace()