2011-09-21 98 views
2

我試圖綁定一個按鍵(「輸入」)來觸發一個jQuery模態對象中的函數。在下面的代碼中,我想在檢測到按鍵事件時觸發$(this).dialog(「login」)。但是,似乎我無法調用self.dialog(「登錄」)。我看着這個錯誤的方式嗎?jQuery UI模式問題

 $("#login-dialog").dialog({ 
     autoOpen: false, 
     height: 250, 
     width: 350, 
     modal: true, 
     open: function() { 
      var self = $(this); 
      $("#login-dialog").load("/accounts/login/", function() { 
       $("#id_username").focus() 
       .keypress(function(event) { 
        if (event.which == 13) { 
         event.preventDefault(); 
         self.dialog("login"); 
        } 
       }); 
      }); 
     }, 

     buttons: { 
      close: function() { 
       $(this).dialog("close"); 
      }, 

      login: function() { 
       $.ajax({ 
        type: "POST", 
        url: "/accounts/login/", 
        data: $("#login-form").serialize(), 
        success: function(data) { 
         var errors = $(data).find("#login-error").val(); 
         if (errors) { 
          $("#error-message").replaceWith("<p class='error'>" + "Your username and password didn't match" + "</p>"); 
         } else { 
          window.location = "/builder"; 
         } 
        } 
       }); 
      } 
     } 
    }); 

回答

0

快速工作圍繞你的問題,裏面的「按鍵」功能,使用下面的代碼

$("#login-dialog").dialog("option").buttons.login(); 
+0

啊,多麼愚蠢的我 - 我應該知道。感謝您的協助! – Beor

0

我會附加一個處理程序到登錄窗體的onsubmit事件。通過這個處理函數,用適當的字段值調用login函數(防止事件的默認值,所以表單實際上沒有提交)。

現在,一個很好的副作用是,按ENTER當在窗體上,該處理程序將被調用。這種方法也會降低一點,並使您的所有代碼更具可移植性。

就我個人而言,我使用一個插件,您只需將一個表單元素傳入,將通過使用所有表單屬性和輸入元素的ajax發送它。