How to manage a ModalWindow containing a form?

Question

Hello,

I'm trying to use a modalwindow "[MW]" inside a page "[MyPage]".

In [MyPage], there is a form and a div having a wicket id to the [MW]. The div is not inside the form of [MyPage]. In [MW], there is a form in which I can do searches to retrieve information from a database.

The fact is, all my forms are working nicely in Firefox and Chrome. But in IE, when I submit the form in [MyPage], it shows the [MW].

I don't know how to solve this problen since I've already separated the modalWindow and the form in [MyPage]. I've tried Javascript like onclick="formInMyPage.submit()" but it still isn't working.

Answer 1

Sorry for answering so late but I got lost in the code. I didn't write it and I'm still beginning with Wicket.
I wanted to start over from the beginning but I am stumped with a problem that I can't seem to understand... I created a simple form:

• a textfield for a serial number
• a button that opens a modalWindow

Opening and closing that modalWindow is not the hard part, but sending a value from the modalWindow in order to insert it in the form is nearly impossible.

I followed almost exactly tutorials on the internet and I don't understand where it went wrong...
When testing my code, this is what I get:

• I select a serialNumber from the modalWindow and I click the "Send" button.
• The modalWindow closes but the serialNumber field in my form is not updated.
• I don't know what is happening because when I set this serialNumber and select another one in the modalWindow, its value disappears.

Here is some code in the formal page

    serialNumber = new TextField("serialNumber");
    modalMateriel = new ModalWindow("modalMateriel");


    modalMateriel.setContent(new ModalWindowMateriel(modalMateriel.getContentId()){
        public void onSave(AjaxRequestTarget ajaxRequestTarget){
            ajaxRequestTarget.addComponent(serialNumber);
            modalMateriel.close(ajaxRequestTarget);
        }
    });


    modalMateriel.setInitialWidth(1000);
    modalMateriel.setWidthUnit("px");
    modalMateriel.setInitialHeight(450);
    modalMateriel.setHeightUnit("px");
    modalMateriel.setTitle(getString("ManageRMA_modal_materiel_title"));
    modalMateriel.setCssClassName(ModalWindow.CSS_CLASS_GRAY);
    addOrReplace(modalMateriel);


    serialNumber.setEnabled(false);
    serialNumber.setOutputMarkupId(true);
    form.addOrReplace(serialNumber);


     form.addOrReplace(new AjaxLink("showModalMaterielButton") {
            @Override
            public void onClick(AjaxRequestTarget ajaxRequestTarget){

                ajaxRequestTarget.appendJavascript( "Wicket.Window.unloadConfirmation = false;" ); 
                modalMateriel.show(ajaxRequestTarget);
            }
        }.setVisible(true));

Here is the modalwindow

private String serialNumberRecherche;

public ModalWindowMateriel(String id){
   super(id);

   Form form = new Form("formMaterielsConsultation");
   List<String> list = new ArrayList<String>();
   list.add("1");
   list.add("11");
   list.add("111");
   list.add("1111");
   list.add("11111");
   form.addOrReplace(new DropDownChoice("serialNumberRecherche",new PropertyModel(this,"serialNumberRecherche"),list));


   //The submit button which aim is ti upDate "serialNumber" in the formal page
   AjaxButton button = new AjaxButton("Envoyer"){

       protected void onSubmit(AjaxRequestTarget ajaxRequestTarget, Form form) {
           onSave(ajaxRequestTarget);
       }
   };

   form.add(button);
   add(form);

}


public abstract void onSave(AjaxRequestTarget ajaxRequestTarget);

public String getSerialNumberRecherche() {
    return serialNumberRecherche;
}

public void setSerialNumberRecherche(String serialNumberRecherche) {
    this.serialNumberRecherche = serialNumberRecherche;
}