Trước tiên tôi có thể xin lỗi vì chất lượng bài đăng của tôi, vì đây là lần đầu tiên tôi đăng trên đây. Tôi đã tìm thấy một số câu trả lời thực sự hữu ích trên trang web này trong quá khứ và vì vậy đã tìm thấy bản thân mình ở một vị trí để trả lại tôi nghĩ rằng tôi muốn cho nó một đi.Thêm điều khiển này trong UpdatePanel - đảm bảo chúng được hiển thị chính xác sau khi đăng lại không đồng bộ
Sau khi đập đầu vào tường một lúc, và tìm kiếm rất ít thông tin trực tuyến, cuối cùng tôi đã tìm được câu trả lời cho vấn đề này và đã trả lời một số câu hỏi vì vậy tôi nghĩ tôi sẽ chia sẻ những phát hiện của mình.
Kịch bản:
- điều khiển người dùng Net mà ám một hộp công cụ addthis với duy nhất url và tiêu đề thuộc tính xác định.
- UpdatePanel chứa một bộ lặp hiển thị nhiều hàng, mỗi hàng chứa một thể hiện của điều khiển người dùng hộp công cụ.
- Nút "Hiển thị thêm kết quả" làm mới UpdatePanel, mỗi lần hiển thị nhiều kết quả hơn.
Vấn đề:
Khi trang web được hiển thị đầu tiên mọi thứ đều tốt. Tất cả các hộp công cụ hiển thị chính xác và hoạt động như mong đợi. Tuy nhiên, khi nhấn nút và UpdatePanel làm mới, các hộp công cụ sẽ biến mất.
Giải pháp:
Trước hết tôi nhanh chóng xác định chắc chắn từ câu hỏi và câu trả lời mà tôi cần thêm một EndRequestHandler trang của tôi sử dụng PageRequestManager rằng sẽ xử lý các yêu cầu async postback và kích hoạt một số javascript để render các toolbox của tôi của người khác.
Tiếp theo, tôi cần tìm hiểu xem javascript này nên là gì.
Tôi tìm thấy một số giải pháp được đề xuất cho vấn đề này trực tuyến, hầu hết bằng cách sử dụng window.addthis = null và sử dụng jquery getScript() để chạy lại javascript addthis tuy nhiên không có cách nào trong số này giải quyết được sự cố. Tôi tiếp tục quay trở lại tài liệu trên trang AddThis mà bạn chỉ nên sử dụng addthis.toolbox() để render các hộp công cụ của bạn với javascript, cái gì đó dường như không hoạt động cho tôi.
Sau đó, tôi đã có một khoảnh khắc bóng đèn. Có vẻ như hàm addthis.toolbox() đã bỏ qua thuộc tính addthis: url và addthis: title mà tôi đã thiết lập trong các hộp công cụ của mình và tôi nhận ra rằng tôi cần chuyển các thuộc tính này vào addthis.toolbox() bằng cách định nghĩa chúng trong phần chia sẻ đối tượng cấu hình. Từ đó mọi thứ trở nên dễ dàng hơn nhiều.
Giải pháp cuối cùng có 3 phần.
Đầu tiên là DIV hộp công cụ định nghĩa trong điều khiển người dùng trong đó có một ID duy nhất và chứa addthis: url và addthis: thuộc tính tiêu đề:
<div id="toolBoxWrapper" class="toolBoxWrapper" runat="server">
<div id='<%="toolBox_" + ControlId%>' class="addthis_toolbox" addthis:url='<%=AssociatedUrl%>' addthis:title='<%=AssociatedName%>' >
<a class="addthis_button_email"></a>
<a class="addthis_button_facebook"></a>
<a class="addthis_button_twitter"></a>
<a class="addthis_button_print"></a>
<a class="addthis_button_compact"></a>
<a class="addthis_counter addthis_bubble_style"></a>
</div>
</div>
Tiếp theo tôi tạo ra một handler PreRender trong việc kiểm soát để tạo ra các javascript chứa định nghĩa của đối tượng cấu hình addthis chia sẻ kiểm soát cụ thể. Điều này không thể được chứa trong trang ascx vì nó không hoạt động.Nó phải được tạo ra sử dụng RegisterStartupScript trong mã máy chủ:
protected void Page_PreRender(object sender, EventArgs e)
{
// This code creates a control specific addthis_share config object so that
// the toolbox can be re-created after an ajax async postback using addthis.toolbox()
// which requires the url and title parameters to be included in the share config.
StringBuilder sb = new StringBuilder();
sb.AppendLine("var addthis_shareconfig_toolBox_" + ControlId + " = {");
sb.AppendLine("url:\"" + AssociatedUrl + "\",");
sb.AppendLine("title:\"" + AssociatedName + "\",");
sb.AppendLine("passthrough: {");
sb.AppendLine(" twitter: {");
sb.AppendLine(" via: 'mydomain'");
sb.AppendLine(" }");
sb.AppendLine("}");
sb.AppendLine("}");
sb.AppendLine("if (toolBoxShareConfigs == null) var toolBoxShareConfigs = {};");
sb.AppendLine("toolBoxShareConfigs['toolBox_" + ControlId + "'] = addthis_shareconfig_toolBox_" + ControlId + ";");
ScriptManager.RegisterStartupScript(this.Page, this.GetType(), "shareToolBox_" + ControlId, sb.ToString(), true);
}
Cuối cùng tôi đã tạo ra một EndRequestHandler trong trang của tôi sử dụng Sys.WebForms.PageRequestManager được kích hoạt khi UpdatePanel đã làm mới. Điều này đi qua tất cả các divs hộp công cụ và tìm đối tượng phần cấu hình có liên quan (quay trở lại một mặc định nếu không tìm thấy) và sau đó gọi addthis.toolbox() đi qua trong đối tượng phần cấu hình:
<script type="text/javascript" language="javascript">
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
function EndRequestHandler(sender, args) {
addthis_config.pubid = 'mypubid';
$(".addthis_toolbox").each(function() {
try
{
var shareConfig = toolBoxShareConfigs[this.id];
}
catch(err)
{
var shareConfig = {
passthrough: {
twitter: {
via: "mydomain"
}
}
};
}
addthis.toolbox(this, addthis_config, shareConfig);
});
}
</script>
Và đó là nó. Bây giờ UpdatePanel của tôi hoạt động hoàn hảo và tất cả các hộp công cụ chia sẻ addthis của tôi hoạt động chính xác và có các url và tiêu đề phù hợp.
Có một vấn đề nổi bật mà tôi đang làm việc mà bộ đếm dường như không hiển thị chính xác sau khi đăng lại không đồng bộ, tuy nhiên đó không phải là vấn đề đối với tôi vì tôi chỉ sử dụng UpdatePanel cho thiết bị di động và không hiển thị bộ đếm. Nhưng nếu có ai có bất kỳ ý tưởng nào về vấn đề này, tôi rất muốn nghe từ bạn.