ASP.NET AJAX Discussion and Suggestions

Re: register a CSS reference on partial postback

Rama Krishna — Wed, 17 Jan 2007 23:35:33 GMT

The easiest way to do this is to use ScriptManager.RegisterClientScriptBlock.

In your control add the following function:

void AddHtmlLink(string rel, string href, string type)
{
    ScriptManager manager = ScriptManager.GetCurrent(Page);
    if (manager.IsInAsyncPostBack)
    {
        Dictionary<string, object> values = new Dictionary<string,object>();
        values.Add("rel", rel);
        values.Add("href", href);
        values.Add("type", type);

        JavaScriptSerializer serializer = new JavaScriptSerializer();

        StringBuilder scriptBuilder = new StringBuilder();

        scriptBuilder.Append("registerLink(");
        serializer.Serialize(values, scriptBuilder);
        scriptBuilder.AppendLine(");");
        ScriptManager.RegisterClientScriptInclude(this, this.GetType(), "LinkRegister", "linkRegister.js");

        ScriptManager.RegisterClientScriptBlock(this, GetType(), "dynLink", scriptBuilder.ToString(), true);
    }
    else
    {
        HtmlLink link = new HtmlLink();
        link.Href = href;
        link.Attributes["rel"] = rel;
        link.Attributes["type"] = type;
        Page.Header.Controls.Add(link);
    }
}

Here is a sample usage:

static int i = 0;

protected override void OnPreRender(EventArgs e)
{
    base.OnPreRender(e);
    
//Just some dummy test
    i = 1 - i;
    AddHtmlLink("Stylesheet", "Test" + (1-i).ToString() + ".css", "text/css");
}

On other thing you will need is the linkRegister.js file. Which will look like this:

function registerLink(obj) {
 var link = document.createElement('link');
 link.href = obj.href;
 link.rel = obj.rel;
 link.type = obj.type;
 document.getElementsByTagName('head')[0].appendChild(link);
}

Sys.Application.notifyScriptLoaded();

There is one flaw in this solution: which is that it does not delete the existing link nodes from DOM. This can be easily solved by adding an Id to the link element and removing it before adding a new link. I leave it to you to implement it according to your needs.

Re: register a CSS reference on partial postback

Bort — Wed, 17 Jan 2007 22:44:50 GMT

I don't quite understand what the Page.Theme has to do with my custom control. I don't want to change the Page.Theme because the comsumer of my custom control will want control over his own Page.Theme. I want my custom control, when it is loaded dynamicaly into the consumer's page, on partial postback, to add its own css reference. The custom control should be independent of the page and the consumer should not have to be concerned with adding this reference.

Re: register a CSS reference on partial postback

stmarti — Tue, 16 Jan 2007 14:14:53 GMT

From an updatepanel trigger setting the Page.Theme or Page.Title seems to works, but the following not works (would be nice)

            HtmlLink link = new HtmlLink( );
            link.Attributes.Add( "href", "/css/some.css" );
            link.Attributes.Add( "type", "text/css" );
            link.Attributes.Add( "rel", "stylesheet" );

            this.Header.Controls.AddAt( 0, link );

And because we cannot put an updatepanel inside the head, we are limited to manipulate the content of the head from the server side.

The only way to register a script in the updatepanel trigger (when dynamically adding your custom control), and that javascript (google for examples) could change/add link elements in the head.

But maybe someone has a better solution for you...

Re: register a CSS reference on partial postback

Bort — Tue, 16 Jan 2007 09:41:31 GMT

Yes, but the styles I am trying to reference have nothing to do with themes. I am building a custom control which must reference a css file if it is to work properly. I am not doing themes for my custom control.

Re: register a CSS reference on partial postback

MIB426 — Sun, 14 Jan 2007 10:05:25 GMT

you can set different skin in the App_Themes folder

You can set different theme by using Page.Theme = Mytheme

You can trigger UpdatePanel event to set Page.Theme

register a CSS reference on partial postback

Bort — Sun, 14 Jan 2007 08:48:52 GMT

How does one go about registering a <link> css reference with the page but only on partial post back. Each partial postback could return a different <link> reference. I have examined all the register methods of the ScriptManager and there isn't any way to do this from what I see.