0

ボタンをクリックするだけでダイアログをロードするページがあります。

function editShowSchedule(emId){
    $(".ui-dialog-content").dialog("close");            
    var url = "inc/ajax/schedule-editShowSchedule.php?emId="+emId+"&stationId="+<?php echo $stationId;?>;   
    var container = '<div id="somediv" title="Modifier l\'horaire d\'une émission"></div>';
    $(container).load(url).dialog({
       //modal:false,
       height: 600,
       width: 600,
       resizable: false,
       buttons: { "Annuler": function() { $(this).dialog("close"); },
               "Sauvegarder": function(){ saveShowSchedule();} }
    });
}

次に、そのダイアログで、ドロップダウンボックスで.change（）をトリガーして、選択した要素に関連する情報を読み込みます。

<?php 
$emId = $_POST['emId'];
$stationId = $_POST['stationId'];
?>

[...]

$(document).ready(function() {  
$("#selectShow").unbind('change');
$("#selectShow").change(function(){
    $("#showTimelines").html('En chargement');
    var emId = $("#selectShow").val();
    var stationId = <?php echo $stationId;?>;
    var params = {emId:emId,
                  stationId:stationId}
    $.post('inc/ajax/schedule-getAllTimelinesByEmId.php',params, function(data){ 
            alert('getTimelineByEmId');
            $("#showTimelines").html(data);             
            $(".button, button, input:submit, input:button").button();  
            enableAddRecurrenceInPeriod();
            enableRecurrenceCloseBox();
        },"html"  
    ); 
})<?php if($emId > 0){?>.change()<?php }?>;
});

初めての場合は、正常に動作します。

しかし、ダイアログボックスを閉じてクリックしてもう一度開くと、アラートは実際に機能しますが、$（ "＃showTimelines"）。htmlには何も表示されません（読み込み中のメッセージ：$（ "＃showTimelines"も表示されません）。 ）.html（'En Chargement'）;）、Firefoxで表示され、ドキュメントが読み込まれた後にのみ投稿しましたが...

誰もがこれを修正する理由および/または方法を知っていますか？

4

2 に答える 2

0

ああ、わかった。私を正しい方向に導いてくれたFelipeに感謝します：jqueryを次のように変更しました：

function editShowSchedule(emId){
$(".ui-dialog-content").dialog("destroy");  
$("#somediv").remove();     
var url = "inc/ajax/schedule-editShowSchedule.php?emId="+emId+"&stationId="+<?php echo $stationId;?>;   
var container = '<div id="somediv" title="Modifier l\'horaire d\'une émission"></div>';
$(container).load(url).dialog({
    //modal:false,
    height: 600,
    width: 600,
    resizable: false,
    close: function(event, ui){
        $(this).dialog("destroy");
        $("#somediv").remove();
    },
    buttons: { "Annuler": function() { $(this).dialog("destroy"); 
                                       $("#somediv").remove(); },
               "Sauvegarder": function(){ saveShowSchedule();} }
});

}

基本的に、クローズは事実上ダイアログを非表示にするだけでした。destroyを使用すると消去されますが、コンテナは非表示になっていますが（したがって、ajaxで作成された新しいダイアログの代わりに更新されます）、$（ "＃somediv"）。remove（ ）;

これで、すべてが正常に機能します。

于 2012-07-10T13:11:11.830 に答える
0

これらの2つのステップを分割すると、機能するはずです。ダイアログを1回作成し（たとえば、ドキュメントの準備ができたら）、ボタンをクリックするだけで「開く」を呼び出します（ダイアログの内部HTMLは通常どおり更新できます）。

jquery ui docsから：

$（foo）.dialog（）を呼び出すと、ダイアログインスタンスが初期化され、デフォルトでダイアログが自動的に開きます。ダイアログを再利用する場合、最も簡単な方法は、次のコマンドで「自動開く」オプションを無効にすることです。

$（foo）.dialog（{autoOpen：false}）
  で開きます
$（foo）.dialog（'open'）。
  それを閉じるには、
$（foo）.dialog（'close'）
于 2012-07-09T20:05:48.487 に答える