Accessibility issue with Ajaxtoolkit

Question

I am working on Section 508 compliance for an existing application.

Now when I use http://achecker.ca/checker/index.php to test my page for Section 508 it shows "script must have a noscript section." for the Ajax generated scripts.

How to get Ajax toolkit to have noscript tag appended after it generates the script on client side.

score 1 · Answer 1 · answered Apr 20 '12 at 22:03

A noscript tag is used to show an alternative to a script, such as when the user has it disabled. So if you have:

<script type="text/javascript">
<!--
var currentTime = new Date()
var month = currentTime.getMonth() + 1
var day = currentTime.getDate()
var year = currentTime.getFullYear()
document.write(month + "/" + day + "/" + year)
//-->
</script>

That checker is seeing if you have a <noscript> right after the code block or on the page altogether. For larger AJAX powered apps, the <noscript> appears just before the closing <body>. Make sure you use good judgement for what you say/put. I have seen developers do:

<script type="text/javascript">
<!--
var currentTime = new Date()
var month = currentTime.getMonth() + 1
var day = currentTime.getDate()
var year = currentTime.getFullYear()
document.write(month + "/" + day + "/" + year)
//-->
</script>
<noscript>
<p>Wow, you suck because you disabled javascript.</p>
</noscript>

Please be more mature than that.

score 0 · Accepted Answer · answered May 29 '12 at 08:12

In Global.asax I have added below event and it worked like a charm

void Application_PostReleaseRequestState(object sender, EventArgs e)

{
    //add no script tag for 508 compatibility               
    if(Response.ContentType == "text/html")
    {
       //add no script tag for 508 compatibility
        Response.Filter = new NoScriptTagAppendFilter(Response.Filter);
    }        
}

public NoScriptTagAppendFilter(Stream stream)

{
    outputStream = stream;
}

public override void Write(byte[] buffer, int offset, int count)
{
    //base.Write(buffer, offset, count);
    string data = UTF8Encoding.UTF8.GetString(buffer);
    data = Regex.Replace(data, "</script>", "</script><noscript></noscript>");
    outputStream.Write(UTF8Encoding.UTF8.GetBytes(data), offset, UTF8Encoding.UTF8.GetByteCount(data));
    data = null;
}

This would definitely help someone in future who wants to 508 compatibility for script generated by Ajax & testing using http://achecker.ca/checker/index.php

Accessibility issue with Ajaxtoolkit

2 Answers2