[jquery-ui] Re: How to use tabs in Dialog ?

of course tabs in dialogs are working:
you should change your code a little:

<!-- html part -->
<div id="dialog_with_tabs" title="Create new user">
    <div id="tabs_in_dialog">
        <ul>
            <li><a href="#tabs-1">Tab 1</a></li>
            <li><a href="#tabs-2">Tab 2</a></li>
            <li><a href="#tabs-3">Tab 3</a></li>
        </ul>
        <div id="tabs-1">
            <p>Content of Tab &quot;1&quot;</p>
        </div>
        <div id="tabs-2">
            <p>Content of Tab &quot;2&quot;</p>
        </div>
        <div id="tabs-3">
            <p>Content of Tab &quot;3&quot;</p>
        </div>
    </div>
</div>
<!-- html part -->

<!-- jquery part -->
    $("#dialog_with_tabs").dialog({
        bgiframe: true,
        autoOpen: false,
        height: 500,
        width: 500,
        modal: true,
        buttons: {
            Cancel: function() {
                $(this).dialog('close');
            }
        }
    });
    $("#dialog_with_tabs").bind('dialogopen', functon() {
        /* init tabs, when dialog is opened */
        $("#tabs_in_dialog").tabs();
    });
    $("#dialog_with_tabs").bind('dialogclose', functon() {
        /* your function */
        allFields.val('').removeClass('ui-state-error');
        /* destroy tabs to avoid problems on re-open */
        $("#tabs_in_dialog").tabs('destroy');
        /* destroy dialog to avoid problems on re-open */
        $("#dialog_with_tabs").tabs('destroy');
    });
    /* your function to open the dialog */
    $("#dialog_with_tabs").dialog('open');
<!-- jquery part -->


On Oct 20, 2:21 am, mrn31 <[email protected]> wrote:
> Hi all , i try this but i get some troubles :
>
> -------- HTML ---------
>
> <button id="tabtest" class="ui-button ui-state-default ui-corner-
> all">tabtest</button>
>
> <div id="dialogtab" title="Create new user">
>         <ul>
>                 <li><a href="#tabs-1">Nunc tincidunt</a></li>
>                 <li><a href="#tabs-2">Proin dolor</a></li>
>                 <li><a href="#tabs-3">Aenean lacinia</a></li>
>         </ul>
>         <div id="tabs-1">
>                 <p>p1</p>
>         </div>
>         <div id="tabs-2">
>                 <p>p1</p>
>         </div>
>         <div id="tabs-3">
>                 <p>p1</p>
>                 <p>p2</p>
> </div>
>
> </div>
>
> -------- JS ---------
>
>         $("#dialogtab").dialog({
>                 bgiframe: true,
>                 autoOpen: false,
>                 height: 500,
>                 width: 500,
>                 modal: true,
>                 buttons: {
>                         Cancel: function() {
>                                 $(this).dialog('close');
>                         }
>                 },
>                 close: function() {
>                         allFields.val('').removeClass('ui-state-error');
>                 }
>         });
>         $("#dialogtab").tabs();
>
>         $('#tabtest').click(function() {
>                 $('#dialogtab').dialog('open');
>         })
>
> It seems that tabs get strange events there...
>
> The aim is to get tabs in a modal window.
>
> Hope you could help.
>
> Tx all for your project, it was cool to do with it
>
> Regards
>
> marine
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups 
"jQuery UI" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to 
[email protected]
For more options, visit this group at 
http://groups.google.com/group/jquery-ui?hl=en
-~----------~----~----~----~------~----~------~--~---