document.ready chưa được kích hoạt với pjax

Question

Tôi đang thử dùng pjax cho một ứng dụng tôi đang phát triển nhưng tôi đã đánh trúng một bức tường.

Có thể tôi đang nói về điều này sai, hãy để tôi giải thích.

Trong ứng dụng, tôi có một menu chính ở trên cùng, với các phần khác nhau. Mỗi liên kết trong menu này được bật pjax, nghĩa là chỉ có phần thân của ứng dụng sẽ thay đổi.

Thông thường, khi bạn bấm vào một liên kết không có pjax, phương pháp document.ready sẽ được kích hoạt. Tôi sử dụng điều này để ràng buộc các sự kiện với các nút như ví dụ sau.

đây là tập tin users.js.coffee tôi

loaded = false; 
$ -> 
    $("#btn_new_user").bind "click", (event) -> 
    if not loaded 
     @path = $('#btn_new_user').attr("path") 
     $("#new-users-container").load(@path) 
     loaded = true 
    $("#new-users-container").slideToggle() 

Như bạn có thể thấy trong ví dụ này, khi "người sử dụng" trang tải xong, nó sẽ ràng buộc một nút với một sự kiện đó sẽ được tải một hình thức vào một div và animate nó để hiển thị nó.

Tuy nhiên, khi tôi bắt đầu ở một phần khác của quản trị viên và nhấp vào liên kết Người dùng để hiển thị nút này, sự kiện không bị ràng buộc. Khi tôi tải lại trang trong phần Người dùng, trình kích hoạt document.ready và nút hoạt động tốt.

Có kỹ thuật nào tốt hơn để ràng buộc các sự kiện với các nút hoặc có cách nào đó để kích hoạt tài liệu.đã có trên pjax không?

Cảm ơn.

Answer 1

Ok, đã học được vài điều hôm qua.

Trước tiên, việc khai báo coffeescript như vậy sẽ làm cho mã chỉ khả dụng cho tệp đó và không thể truy cập được ở bất kỳ nơi nào khác.

Cách phổ biến xung quanh này là, ví dụ

Users = 
    aMethod: -> 
     // some code 


window.Users = Users 

sau đó ở một số nơi khác bạn có thể làm

window.aMethod 

dù sao, đó chỉ là một phần của vấn đề, các giải pháp thực tế đã sử dụng phương thức đại biểu http://api.jquery.com/delegate/, cho phép bạn liên kết các phần tử mà không có chúng ở đó.

Answer 2

Đây là cách tôi hiện đang thực hiện việc này.

1. Sử dụng tính năng ràng buộc đại biểu như được chỉ ra tại đây cho các sự kiện.

2. Đối khởi khác, thực hiện nó theo cách này (trong nguyên Javascript)

   window.pjax_load = function() { 
       $('#foo').do_whatever(); 
       ... 
   } 
   
   $(document).ready(function() { 
       // setup events etc 
   
       window.pjax_load(); 
       $('a').pjax("#container"); 
       $('#container').on('pjax:end', function() { window.pjax_load(); }); 
   }); 
   

Answer 3

này sẽ làm việc hoàn hảo:
Tất cả bạn cần làm là bao gồm kịch bản của bạn sau khi hoàn thành yêu cầu pjax.

Include Pjaxstandalone.js here then 

<script type='text/javascript'> 
    pjax.connect({ 
     'container': 'content', 
     'beforeSend': function(){console.log("before send");}, 
     'complete': function(){ 
      console.log("done!"); 
      // Your custom script here 
     } 
    }); 
</script> 

Hy vọng nó sẽ giúp .. !!