Cập nhật jQueryBắt đầu khởi động

Question

Tôi hiện đang cố gắng sử dụng "colResizable" cho GridView được đặt bên trong AJAX UpdatePanel. Ngày tải đầu tiên, nó hoạt động tốt, nhưng bất cứ khi nào UpdatePanel được cập nhật, nó dừng lại.

Tôi hiểu điều này là do làm mới toàn bộ pannel, điều này có nghĩa là tất cả nội dung được thêm bởi khởi tạo sẽ không được thêm lại.

Tôi đã thử các "add_endRequest" giải pháp

var prm = Sys.WebForms.PageRequestManager.getInstance(); 
prm.add_endRequest(function() { 
    $(".GridViewStyle").colResizable({ liveDrag: true }); 
} 

Tuy nhiên, nó được gọi là quá sớm và không khắc phục vấn đề của tôi.

Tôi đã đọc về phương thức ".live()", nhưng tôi không hiểu cách tôi có thể sử dụng nó để khởi tạo. Đối với các sự kiện như "di chuột", tôi thấy nó được sử dụng như thế nào và nó khá đơn giản ... tuy nhiên, đối với inits, tôi không hiểu.

dòng initilization hiện tại của tôi là:

$(document).ready(function() { 
    $(".GridViewStyle").colResizable({ liveDrag: true }); 
}); 

Tiếp nối "mouseover" dụ, nhưng tôi không thể tìm ra sự kiện để treo lên để, như tài liệu không liệt kê bất cứ điều gì như "Load ". Nếu có, tôi sẽ sử dụng một cái gì đó như thế này ...

$(".GridViewStyle").live("load", function() { $(".GridViewStyle").colResizable({ liveDrag: true }); }); 

Tôi đã tìm kiếm xung quanh nhưng chưa tìm thấy thứ gì đó phù hợp với nhu cầu của tôi. Tôi khá mới với jQuery nên tôi có thể không sử dụng từ vựng/khái niệm đúng.

Answer 1

Bạn có thể sử dụng pageLoaded sự kiện của PageRequestManager thay vì endRequest. Xem tài liệu sự kiện này:

Tăng sau khi tất cả nội dung trên trang được làm mới do kết quả đồng bộ hoặc đăng lại không đồng bộ.

Ngoài ra, trong trình xử lý sự kiện này, bạn có thể áp dụng plugin colResizable chỉ khi UpdatePanel nơi điều khiển GridView được tạo hoặc cập nhật. Điều này cho phép bạn để tránh các cuộc gọi Plugin khởi dư thừa trên mỗi postback async rằng có thể tăng lên bằng cách điều khiển trong một số UpdatePanel khác

Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(initializeResizeable); 

function initializeResizeable(sender, args) { 
    var context = $(args.get_panelsCreated()).add(args.get_panelsUpdated()); 
    $(".GridViewStyle", context).colResizable({ liveDrag: true }); 
} 

Ngoài ra, với kịch bản này, bạn có thể loại bỏ Plugin khởi từ handler document.ready như kịch bản này sẽ được được thực thi khi tải trang đầu tiên cũng như trên mỗi lần đăng lại không đồng bộ

Answer 2

.live() bị phản đối vì vậy hãy thử sử dụng phương pháp .on() jQuery thay vì:

$(document).on("change", $('.GridViewStyle'), function() { 
    $(this).colResizable({ liveDrag: true }); 
}); 

Ngoài ra, bạn có thể muốn đặt postbackSafe: true trong initializer của bạn để giữ những thay đổi độ rộng cột trong postback.