jquery - ダイアログ ボックス内のタブがレンダリングされない

Question

ダイアログ ボックス内のタブを初期化しようとしていますが、機能しません。ダイアログ ボックス html は、初期化によって追加されます。生のhtmlを取り戻しています。私が試したコードは次のようになります。ただし、ブレークポイントのあるfirebugではコードが機能します

//HTML
<div id="tabs">
    <ul>
        <li><a href="#tab-1">Edit</a>
        </li>
        <li><a href="#tab-2">Send Email</a>
        </li>
    </ul>



    <div id="tab-1">

        <form action="#" method="post" id="edit_form"></form>
    </div>
    <div id="tab-2">
        <div id="contact-wrapper">
            <form method="post" action="mailer.php" id="contactform"></form>
        </div>

    </div>

</div>

そしてジャバスクリプト

  // Init Dialog
        $('a.open_dialog').click(function() {
            $('#tabs').tabs();

            $('<div />').appendTo('body').load($(this).attr('href')).dialog({
                title: $(this).attr('title'),
                modal: true,
                draggable: false,
                width: 800,
                position: 'top',
                buttons: {
                    "Save": function() {
                        $.ajax({
                               type: "POST",
                               url: 'action.php',
                               data: $("#edit_form").serialize(), // serializes the form's elements.
                               success: function(data)
                               {
                                   alert(data); // show response from the php script.
                               }
                             });

                    },
                    "Send Email": function() {

                        $.ajax({
                               type: "POST",
                               url: 'mailer.php',
                               data: $("#contactform").serialize(), // serializes the form's elements.
                               success: function(data)
                               {
                                   alert(data); // show response from the php script.
                               }
                             });
                    }
                },
                close: function() {
                    location.reload(true);
                    allFields.val( "" ).removeClass( "ui-state-error" );


                }
            });

Answer 1

ダイアログが開いたら、タブを初期化する必要があります。

$('<div />').dialog({
    open : function(){  //In case of autoOpen = true
      $('#tabs').tabs();
    }
});

.tabs()そうでない場合は、後で呼び出すことができます.dialog()