2011-05-04 127 views
1

您好我有一個問題,當我的腳本完成處理時使用jquery覆蓋失敗關閉。jquery覆蓋不會關閉

我所做的只是顯示一個非常簡單的表單,將提交的值在後臺處理並添加到頁面中。一旦完成,覆蓋圖應該關閉,但是它只是停留在那裏,並且直到我進行整頁刷新時纔會去。

我的jQuery代碼看起來是這樣的:

function employmenthistory(){ 

    $(document).ready(function(){ 

     /** 
     * Modal Dialog Boxes Setup 
     */ 
     var triggers = $(".modalInput").overlay({ 

      // some mask tweaks suitable for modal dialogs 
      mask: { 
       color: '#ebecff', 
       loadSpeed: 200, 
       opacity: 0.7 
      }, 

      closeOnClick: false 
     }); 

     /* User Input Prompt Modal Box */ 
     $("#employmentprompt form").submit(function(e) { 

      // get user input 
      var name = $("#name", this).val(); 
      var role = $('#role', this).val(); 
      var title = $("#title", this).val(); 

      //we need to know how many elements already exist 
      var elementCount = $('li.note').length; 

      //update server with information about this employment 
      $.ajax({ 
       url: '/addempl/', 
       type : 'post', 
       data : "name=" + name + "&role=" + role + "&title=" + title + "&ec=" + elementCount, 
       dataType: "json", 
       success : function(msg){ 

        //confirm the event was successful 
        if(msg.status == 'success'){ 

         var item = msg.data; 

         //we now add to the ul for elements 
         $('ul.listing').append(item); 

        }else{ 

         //failed to process so display error 
         $('div.message error').html('<p>We were unable to add your employment history</p><p>Please try again</p>'); 
        } 
       }, 
       error : function(err){ 

        //failed to call server 
        $('div.message error').html('<p>We were unable to add your employment history</p><p>Please try again</p>'); 
       } 
      }); 

      // close the overlay 
      triggers.eq(0).overlay().close(); 

      // do not submit the form 
      return e.preventDefault(); 
     }); 
    }); 



} 

這段代碼的所有方面工作天晴,當我到達

triggers.eq(0).overlay().close(); 

與形式覆蓋在它仍然在頁面上。只有一個modelInput元素和窗體可以調用,所以我不知道爲什麼這是失敗的。

所有我所做的就是按照這可以在這裏找到了例子:

http://flowplayer.org/tools/demos/overlay/modal-dialog.html

任何幫助,這將受到歡迎。

謝謝。

回答

1

我認爲你需要在你的覆蓋命令中使用api參數。我沒有看到他們的榜樣,但我記得那是過去的問題。

var triggers = $(".modalInput").overlay({ 

     // some mask tweaks suitable for modal dialogs 
     mask: { 
      color: '#ebecff', 
      loadSpeed: 200, 
      opacity: 0.7 
     }, 

     closeOnClick: false, 
     api: true 
    }); 

更新

這裏是示出從另一模態的打開/關閉以及開口一個模態一個Working Demo。希望能幫助到你。

這是我目前使用的代碼......導致整個頁面刷新/提交表單的

var currentModal; 

function openModal(divName){ 
    closeModal(); 
    if ($('#' + divName).length>0){ 
     currentModal=$('#'+divName).overlay({ 
      mask: {color: '#000000'},  
      top:'0px', 
      api: true   
     }).load(); 
    } 
}  
function closeModal(){ 
    if (currentModal){ 
     if (currentModal.isOpened){ 
      currentModal.close(); 
     } 
    } 
} 
+0

黯然。 – 2011-05-04 20:52:16

+0

請參閱我的更新與工作演示。 – Dutchie432 2011-05-05 12:52:52