How to make Wicket Jquery ui dialog as reponsive???

[sujit kirve]

Hi

I have used the  Wicket Jquery ui dialog in one of my project web site, which works very well, but  now I have to make that web site as a responsive....

I have used Bootstrap to add responsive functionality but can not apply same  on Jquery  dialog  as the structure & CSS classes are different on it.

I would like to know,  is there any way or configuration available in Jquery Dialog to make it as responsive???

Your Help is Appreciated  !!! 

[Sebastien]

Hi Sujit

Actually this is more a jQuery UI question than a Wicket jQuery UI one...

It seems to not be shipped out of the box, but if I had to do this, I would go for this add-on:

https://github.com/jasonday/jQuery-UI-Dialog-extended

The way you can use it:

public MyDialog(String id /*, ... */)
{
    super(/* ... */);
   
    this.add(new ResponsiveDialogBehavior());
}

static class ResponsiveDialogBehavior extends Behavior
{
    public ResponsiveDialogBehavior()
    {
    }
   
    @Override
    public void renderHead(Component component, IHeaderResponse response)
    {
        super.renderHead(component, response);
       
        JavaScriptResourceReference reference = new JQueryPluginResourceReference(MyDialog.class, "jquery.dialogOptions.js");
        HeaderItem headerItem = JavaScriptHeaderItem.forReference(reference);
       
        response.render(new PriorityHeaderItem(headerItem));
    }
}

Hope this helps,
Sebastien.