web-dev-qa-db-fra.com

jquery ui: impossible d'appeler des méthodes dans la boîte de dialogue avant l'initialisation; a tenté d'appeler la méthode 'close'

J'utilise la boîte de dialogue jquery ui, je la télécharge sur le site Web de jquery ui. La version est jquery-ui-1.10.2.custom.min.js maintenant je rencontre une question: lorsque la boîte de dialogue est ouverte et que vous cliquez sur le bouton Enregistrer, je veux que la boîte de dialogue soit fermée, voici mon code:

$(function(){
 $("#dialog-form").dialog({
     autoOpen: false,
     height: 350,
     width: 450,
     modal: true,
     buttons: {
       "save": function() {
           if(!checkDept()){
               return ;
           }
           $.post('dept_save.do', 
                 {'dept.deptId':$("#dialog_dept_deptId").val(), 
                  'dept.deptName':$("#dialog_dept_deptName").val(),
                  'dept.manager':$("#dialog_dept_manager").val(),
                 },function(data, status, xhr){
                     if(status == 'success'){
                         alert('save success');
                         $(this).dialog("close");
                     }else{
                         alert('error:'+data);
                     }
                  }
                 ,"json");
       }
     },
     close: function() {
         $(this).dialog("close");
     }
   });

     /* to open dialog*/
    $("#add").click(function(){
        $("#dialog-form").dialog("open");
    });

À présent, lorsque je ferme la boîte de dialogue contextuelle «Enregistrer le succès», la boîte de dialogue dialog-form n'est pas fermée et une erreur se produit:

Erreur non capturée: impossible d'appeler des méthodes dans la boîte de dialogue avant l'initialisation; a tenté d'appeler la méthode 'close' jquery-1.9.1.js: 507.

et il y a une autre erreur:

Uncaught SyntaxError: Jeton inattendu o jquery-1.9.1.js: 541

merci.

jqueryjquery-ui
21
hiway

Vous perdez le contexte de this une fois dans $.post(). Avant votre $ .post, enregistrez le contexte this dans une variable de cette fonction save button.

$('#dialog-form').dialog({
     // .....
     buttons: {
        'save': function() { 

            var $this = $(this); 
                      // -this- is still the original context 
                      // of $("#dialog-form")

            $.post({
               /// ...
               $this.dialog('close'); // <-- used here
            });
        }       
    }
});
33
Mark Pieszak - DevHelp.Online

Lorsque vous initialisez une boîte de dialogue en appelant la méthode .dialog(options), une nouvelle boîte de dialogue est créée, mais elle n'est pas associée à la div d'origine que vous souhaitez convertir en boîte de dialogue (le 'formulaire de dialogue #' dans votre exemple de code). La fonction dialog(options) renvoie l'élément contenant les données de la boîte de dialogue. Donc, si vous le faites de cette façon:

var myDialog = $("#dialog-form").dialog(options);

Vous pouvez ensuite appeler la méthode open comme ceci:

myDialog.dialog('open');

Si vous voulez trouver l'élément contenant le dialogue, c'est le div le plus proche avec la classe "ui-dialog-content":

var myDialog = $('#dialog-form').closest('div.ui-dialog-content');

Les données de la boîte de dialogue sont les données uiDialog que vous verrez si vous examinez les données de cet élément:

myDialog.data();
9
JotaBe

$(this) ne cible pas la boîte de dialogue dans $.post, vous devez y stocker une référence.

var self = this; // add this
$.post(..., function(){
    $(self).dialog("close"); // modify this to use self
4
Kevin B

Je devais faire ce qui suit pour que mon dialogue soit fermé.

 $("#Note").dialog({
        autoOpen: true,            
        modal: true,
        create: function (e, ui) {
          //
        },
        open: function () {
            //
        },            
        buttons: {
                //
                $(".ui-dialog-titlebar-close").trigger('click');
            }
        }
    });
2
Amit

vous avez peut-être utilisé un popup au lieu d'un dialogue. Je pense que les méthodes pour fermer les deux sont différentes. essayez d'utiliser $("#popid").popup('close');

0
user3768400

Une autre chose pouvant provoquer cette erreur est si, pour une raison quelconque, vous appelez removeData () dans la boîte de dialogue. Apparemment, la fonction jquery data () est utilisée pour initialiser la boîte de dialogue. Par conséquent, si, pour une raison quelconque, les données sont supprimées, la boîte de dialogue ne pensera pas qu’elle a été initialisée.

Je l'ai découvert lorsque je stockais des données de formulaire dans l'objet de dialogue avec la fonction data (), puis que j'ai appelé removeData () dans la boîte de dialogue juste avant de la fermer.

0
dallin