Tải không đồng bộ các điều khiển của người dùng trong một trang

Question

Tôi đã tạo một trang để hiển thị nhiều điều khiển người dùng bên trong các bảng cập nhật. Một số điều khiển người dùng sẽ được tải nhanh hơn và một số có thể mất nhiều thời gian hơn để tải. Bây giờ khi trang tải, nó chờ tất cả các điều khiển của người dùng được tải và chỉ hiển thị trang sau đó. Nhưng tôi muốn tải các điều khiển người dùng một cách không đồng bộ với một hình ảnh bộ nạp cho mỗi người trong số họ để các điều khiển trọng lượng nhẹ của người dùng sẽ được tải một cách dễ dàng mà không phải chờ những người nặng hơn.

Vui lòng giúp tôi tìm giải pháp.

---

Tôi đã tải thành công kiểm soát người dùng vào trang của mình bằng phương pháp trên. Tuy nhiên bây giờ tôi đang phải đối mặt với khó khăn trong việc tải usercontrols chứa điều khiển ajax như chứa tab, lịch mở rộng vv ..

Có bất kỳ công việc xung quanh cho vấn đề này

Answer 1

Bạn sẽ chạy vào một loạt các vấn đề: ViewState, điều khiển cần thẻ biểu mẫu, postbacks sẽ không hoạt động nhưng nếu bạn đang làm điều này với một điều khiển hoàn toàn là View nó sẽ hoạt động tốt.

Script:

//use .ready() or pageLoad() and pass params etc if you need to 
$.ajax({ 
    type: 'POST', 
    url: 'Default.aspx/GetControlViaAjax', 
    data: "{}", 
    contentType: "application/json; charset=utf-8", 
    dataType: "json", 
    success: function (data) { 
     $('#yourdiv').html(data.d); 
    } 
}); 

WebMethod:

[WebMethod] 
    public static string GetControlViaAjax() 
    { 
     //example public properties, send null if you don't have any 
     Dictionary<string, object> d = new Dictionary<string, object>(); 
     d.Add("CssClass", "YourCSSClass"); 
     d.Add("Title", "Your title"); 
     return RenderUserControl("/yourcontrol.ascx", true, d, null, null); 
     //use this one if your controls are compiled into a .dll 
     //return RenderUserControl(null, true, d, "Com.YourNameSpace.UI", "AwesomeControl"); 

    } 

Render phương pháp:

private static string RenderUserControl(string path, bool useFormLess, 
     Dictionary<string, object> controlParams, string assemblyName, string controlName) 
    { 

     Page pageHolder = null; 
     if (useFormLess) 
     { 
      pageHolder = new FormlessPage() { AppRelativeTemplateSourceDirectory = HttpRuntime.AppDomainAppVirtualPath }; //needed to resolve "~/" 
     } 
     else 
     { 
      pageHolder = new Page() { AppRelativeTemplateSourceDirectory = HttpRuntime.AppDomainAppVirtualPath }; 
     } 

     UserControl viewControl = null; 

     //use path by default 
     if(String.IsNullOrEmpty(path)) 
     {  
      //load assembly and usercontrol when .ascx is compiled into a .dll   
      string controlAssemblyName = string.Format("{0}.{1},{0}", assemblyName, controlName); 

      Type type = Type.GetType(controlAssemblyName);    
      viewControl = (UserControl)pageHolder.LoadControl(type, null); 
     } 
     else 
     { 
      viewControl = (UserControl)pageHolder.LoadControl(path);  

     }    

     viewControl.EnableViewState = false; 

     if (controlParams != null && controlParams.Count > 0) 
     { 
      foreach (var pair in controlParams) 
      { 
       Type viewControlType = viewControl.GetType(); 
       PropertyInfo property = 
        viewControlType.GetProperty(pair.Key); 

       if (property != null) 
       { 
        property.SetValue(viewControl, pair.Value, null); 
       } 
       else 
       { 
        throw new Exception(string.Format(
         "UserControl: {0} does not have a public {1} property.", 
         path, pair.Key)); 
       } 
      } 
     } 

     if (useFormLess) 
     {     
      pageHolder.Controls.Add(viewControl); 
     } 
     else 
     { 
      HtmlForm form = new HtmlForm(); 
      form.Controls.Add(viewControl); 
      pageHolder.Controls.Add(form); 
     } 
     StringWriter output = new StringWriter(); 
     HttpContext.Current.Server.Execute(pageHolder, output, false); 
     return output.ToString(); 
    } 

FormlessPage lớp:

public class FormlessPage : Page 
    { 
     public override void VerifyRenderingInServerForm(Control control) 
     { 
     } 
    } 

Answer 2

điều khiển người dùng có lẽ không phải là câu trả lời đúng, vì chúng có nghĩa là cho thành phần phía máy chủ. bạn có thể cần một số thành phần độc lập (theo nghĩa thức được phục vụ độc lập) trên máy chủ phục vụ các đoạn html bạn cần để bạn có thể yêu cầu chúng bằng javascript và đưa kết quả vào trang lớn hơn.