4

を使用して編集ユーザー情報を取得するユーザー情報編集ダイアログを作成しています$.postが、HTML 要素を使用してダイアログが初期化されていないため、このダイアログを閉じることができません。

私は試し$('#editUser').dialog('close')ていますが、うまくいきません。

以下が本体です。

<div id='userInfo'>
<div class='user'>
    <span class='userId'>1</span>
    <span class='userName'>John</span>
</div>
<div class='user'>
    <span class='userId'>2</span>
    <span class='userName'>Jane</span>
</div>

ダイアログの作成に使用されるスクリプトは次のとおりです。

$(function() {
$('.user').click(function() {
     var uid = $(this).find('span.userId').html();
    $post('/e-val/user/edit.php', {id: uid}, function(html) {
       $(html).dialog();
    });
});

$('body').on('click', '#closeEditDialog', function() {
   $('#editUser').dialog('close')
});
});

ダイアログは期待どおりに正常に開きますが、正常に閉じません。

これは、ajax スクリプトによって返されるダイアログの HTML です。

<div id='editUser'>
<table>
    <tr>
        <td>Username</td>
        <td><?php echo $user['name'] ?></td>
    </tr>
    <tr>
        <td>Email</td>
        <td><?php echo $user['email'] ?></td>
    </tr>
    <tr>
        <td colspan='2'>
<input type='button' id='closeEditDialog' value='close' />
</td>
    </tr>
</table>
</div>

閉じるにはどうすればよいですか？ダイアログを削除するために使用できます$('#editUser').remove()が、削除するのではなく閉じる必要があります。

4

3 に答える 3

2

ダイアログを作成する前に、その html を DOM に挿入する必要がある場合があります。

$("body").append(html);
$("#editUser").dialog();

少なくとも、ダイアログがこのように表示された場合、閉じるのを妨げるものは何もありません。同じセレクターを使用しています。

編集

また、.dialog() がウィジェットを初期化することを忘れないでください。一度しか呼び出さないようにしてください。代わりに .dialog("open") を使用してください。

ダイアログの div を html に既に追加してから、サーバー側のコードを追加して、ダイアログのコンテンツを動的に更新することをお勧めします。

于 2012-08-10T13:12:15.360 に答える
2 
var mydialog;
$(function() {
$('.user').click(function() {
     var uid = $(this).find('span.userId').html();
    $post('/e-val/user/edit.php', {id: uid}, function(html) {
       mydialog = $(html);
       mydialog.appendTo('body');
       mydialog.dialog();
    });
});

$('body').on('click', '#closeEditDialog', function() {
   mydialog.dialog('close')
});
});
于 2012-08-10T12:56:02.653 に答える
1

$('#editUser').dialog('close')$('#editUser')の初期化に使用しdialogたことがないため、動作しません。したがって、それを使用して閉じることもできません。作成に使用したのと同じハンドラーを使用する必要があります。

ここでGil＆Trinhが回答したように：最初にダイアログのコンテンツをDOMに追加してから、ダイアログを初期化してください：

$post('/e-val/user/edit.php', {id: uid}, function(html) {
   $(html).appendTo('body');
   $('#editUser').dialog( {autoOpen: false} );
});

autoOpen: false$('#editUser').dialog('open')ダイアログが自動的に開くのを防ぎ、いつでも開くことができます。

于 2012-08-11T03:06:20.293 に答える