BeanEditForm in jquery.dialog - problem with validation

classic Classic list List threaded Threaded
2 messages Options
Reply | Threaded
Open this post in threaded view
|

BeanEditForm in jquery.dialog - problem with validation

Matthias Bieber
Hello,
 
I have a BeanEditForm inside a jquery.dialog. The dialog will be opened if you click on a link.
I want to validate the input by using onValidateFrom..Form..() and form.recordError().
 
Once the submit button has been clicked, the page will be reloaded and the jquery.dialog disappears.
After opening the dialog again, the BeanEditForm has been reset. So the error message has not been displayed.
 
Do you know how to keep the dialog open with the current error message?
 
Thank you.

 
Index.tml:
<html t:type="layout" title="HelloWorld Index"
      t:sidebarTitle="Framework Version"
      xmlns:t="http://tapestry.apache.org/schema/tapestry_5_3.xsd"
      xmlns:p="tapestry:parameter">
    <t:jquery.dialogajaxlink t:id="createPerson" class="linkbutton round"
                        t:dialog="newPersonDialog" t:zone="newPersonDialogZone">
        Create Person
    </t:jquery.dialogajaxlink>
                    
    <t:jquery.dialog t:id="newPersonDialog" t:clientId="newPersonDialog"
                params="newPersonDialogParams">
        <t:zone t:id="newPersonDialogZone" id="newPersonDialogZone">
            <t:BeanEditForm t:id="personForm" t:object="person" t:cancel="true" exclude="id, owner"/>
        </t:zone>
    </t:jquery.dialog>
</html>
 
Index.java:
    @Property
    private Person person;
    
    @Component(id = "personForm")
    private BeanEditForm form;
    @InjectComponent
    private Zone newPersonDialogZone;
    
    public Index()
    {
        person = new Person();
    }
          
    @Log
    void onValidateFromPersonForm()
    {
        String name = person.getName();
        
        if(name == null || name.isEmpty())
            form.recordError("Please enter a name");
    }
    
    Object onActionFromCreatePerson() {
        return newPersonDialogZone.getBody();
    }
    
    public JSONObject getNewPersonDialogParams() {
        JSONObject obj = new JSONObject();
        obj.put("autoopen", "true");
        obj.put("modal", "true");
        obj.put("title", "Title");
        obj.put("height", "auto");
        obj.put("width", "auto");
        return obj;
    }

---------------------------------------------------------------------
To unsubscribe, e-mail: [hidden email]
For additional commands, e-mail: [hidden email]

Reply | Threaded
Open this post in threaded view
|

Re: BeanEditForm in jquery.dialog - problem with validation

Chris Poulsen
Try bindnig the BeanEditForm to the zone to prevent full page reload on
submit (zone="^")

On Wed, Jul 15, 2015 at 4:34 PM, Matthias Bieber <[hidden email]> wrote:

> Hello,
>
> I have a BeanEditForm inside a jquery.dialog. The dialog will be opened if
> you click on a link.
> I want to validate the input by using onValidateFrom..Form..() and
> form.recordError().
>
> Once the submit button has been clicked, the page will be reloaded and the
> jquery.dialog disappears.
> After opening the dialog again, the BeanEditForm has been reset. So the
> error message has not been displayed.
>
> Do you know how to keep the dialog open with the current error message?
>
> Thank you.
>
>
> Index.tml:
> <html t:type="layout" title="HelloWorld Index"
>       t:sidebarTitle="Framework Version"
>       xmlns:t="http://tapestry.apache.org/schema/tapestry_5_3.xsd"
>       xmlns:p="tapestry:parameter">
>     <t:jquery.dialogajaxlink t:id="createPerson" class="linkbutton round"
>                         t:dialog="newPersonDialog"
> t:zone="newPersonDialogZone">
>         Create Person
>     </t:jquery.dialogajaxlink>
>
>     <t:jquery.dialog t:id="newPersonDialog" t:clientId="newPersonDialog"
>                 params="newPersonDialogParams">
>         <t:zone t:id="newPersonDialogZone" id="newPersonDialogZone">
>             <t:BeanEditForm t:id="personForm" t:object="person"
> t:cancel="true" exclude="id, owner"/>
>         </t:zone>
>     </t:jquery.dialog>
> </html>
>
> Index.java:
>     @Property
>     private Person person;
>
>     @Component(id = "personForm")
>     private BeanEditForm form;
>     @InjectComponent
>     private Zone newPersonDialogZone;
>
>     public Index()
>     {
>         person = new Person();
>     }
>
>     @Log
>     void onValidateFromPersonForm()
>     {
>         String name = person.getName();
>
>         if(name == null || name.isEmpty())
>             form.recordError("Please enter a name");
>     }
>
>     Object onActionFromCreatePerson() {
>         return newPersonDialogZone.getBody();
>     }
>
>     public JSONObject getNewPersonDialogParams() {
>         JSONObject obj = new JSONObject();
>         obj.put("autoopen", "true");
>         obj.put("modal", "true");
>         obj.put("title", "Title");
>         obj.put("height", "auto");
>         obj.put("width", "auto");
>         return obj;
>     }
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: [hidden email]
> For additional commands, e-mail: [hidden email]
>
>