asp使用jquery异步加载用户控件

大家如果想用jquery选择一个标签然后加载用户控件.如$(“#div”).load(“Controler/UserList.ascx”),可是如果这样去load一个用户控件,它会报错:”由于已明确禁止所请求的页类型,无法对该类型的页提供服务。扩展名“.ascx”可能不正确。 请检查以下的 URL 并确保其拼写正确”。
所有我们要想出来一个办法.来完美的完成这个功能.
首先设想一下,如果有这样一个类,它叫一PageProxy,这个类继承Page类,然后让我们的页面继承这个PageProxy类,而不是像默认的那样继承System.Web.UI.Page,使我们在页面上能够直接load用户控件,那么如果我们要在哪个页面上异步load一个用户控件,我们就让那个页面继承这个PageProxy就行了.由于这个类是给其他类继承的,所以有 public abstract class PageProxy : Page。具体代码如下

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Services;
using System.Web.UI;
using System.IO;
using blog;
namespace blog.Class
{
    public abstract class PageProxy : System.Web.UI.Page
    {
        [WebMethod]
        public static string RenderUserControl(string postid, string action)
        {
            if (action == "getlist")
            {
                Page page = new Page();
                UserControl.PostList postlist = (UserControl.PostList)page.LoadControl("/UserControl/PostList.ascx");
                postlist.setid(Convert.ToInt32(postid));
                page.Controls.Add(postlist);
                StringWriter writer = new StringWriter();
                HttpContext.Current.Server.Execute(page, writer, false);
                System.Threading.Thread.Sleep(2000);
                return writer.ToString();
            }
            else if (action == "getedit")
            {
                Page page = new Page();
                UserControl.EditPost editpost = (UserControl.EditPost)page.LoadControl("/UserControl/EditPost.ascx");
                editpost.setid(Convert.ToInt32(postid));
                page.Controls.Add(editpost);
                StringWriter writer = new StringWriter();
                HttpContext.Current.Server.Execute(page, writer, false);
                return writer.ToString();
            }
            else
            {
                return "";
            }
        }

    }
}

然后让我们的页面都继承这个类.

public partial class Index :Class.PageProxy
这样我们就可以用ajax访问这个方法了。到这里我们可以使用我另一篇文章:使用jQuery.ajaxWebService请求后台WebMethod方法,Ajax处理更加简练中封装的$.ajaxWebService(url, dataMap, fnSuccess)来访问这个方法了.那现在比如我们要在一个div中加载一个叫UserList.ascx的用户控件:
因为我们还没有直接可以像这样$(“div”).load(“UserList.ascx”);简单的加载一个用户控件。要实现这样其实也很简单只要给jQuery做个扩展,对上面的代码进行一下封装就OK了。代码如下:

$.fn.loadUserControl = function (id, page,action) {
    var $dom = this;
    if (page == "" || page == null) {
        page = location.pathname.replace("/", "");
    }
    page += "/RenderUserControl"; //RenderUserControl是PageProxy中的方法,不要轻易修改
    $.ajaxWebService(page, "{postid:'" + id + "',action:'"+action+"'}", function (result) {
        $dom.html(result.d);
    });

}

这样我们就可以这样来加载

var childdiv = $("<div></div>");
childdiv.loadUserControl(i.toString(), null, "getlist");

感谢祥叔大神的分享.地址

http://www.cnblogs.com/xumingxiang/archive/2010/05/04/1727614.html

发表评论

电子邮件地址不会被公开。 必填项已用*标注