Yet Another Blog on ASP.NET and Some Other Stuff

I have recently figured out that if there is a scrollbar’ed Panel control inside an UpdatePanel, it looses its scrollbar position after any type of partial postback within that UpdatePanel. There can be a GridView, a DIV container or another similar control instead of this Panel.

I have searched and found some workarounds at ASP.NET forums, and this specific one was the easiest one to implement into every situation in order to gain back the position of scrollbar. I enhanced it a bit by handling null cases and using the ClientID property. Here is the result:

Update

You can read the “Reusable JavaScript Component” version of this post in here. Thanks Matt!

When a ListView, or GridView as well, allows sorting and is inside an UpdatePanel, it always bothers me that any of the sorting links in the header row are still clickable even though the initiated sorting progress is not being completed. Most of the time this situation may yield an error if the ListView is dealing with many records since everything happens inside an UpdatePanel asynchronously. As there are some other possible ways to beat this, here is my solution by utilizing a transparent image to cover up the ListView while it is being sorted.

• This link about CSS image transparency and opacity would be a good reading before jumping into the solution.

• I will be extending one of my former sample codes that I created here.

Solution

Instead of creating large volume of data for the sample code, I will just simulate 5 seconds sleeping inside the sorting event of ListView1:

Then, I will create the DIV which holds the image that will be made transparent via CSS at a later time and place ListView1 inside an UpdatePanel to have asynchronous postbacks:

Final nested code view with a global DIV named as “ListViewGlobalDIV” should be similar to the following:

I will make the “transparent.gif” transparent by using the following CSS code:

(”transparent.gif” is just a plain gray image having the approximate width and height of ListView1.)

This way of creating transparent images is not a CSS standard yet, but it works well in most of the modern browsers.

Notice the usage of absolute positioning in order to overlap TempTransparentDIV and UpdatePanel1.

Finally, time to write the JavaScript part:

If the JavaScript code refers to any objects from the ASP.NET AJAX Library, then it should be placed after the library has been loaded. Therefore, putting the above script to the end of the page would be a good practice since ScriptManager1 loads the library in this sample code.

As a result…

When you sort ListView1, it will be covered by “transparent.gif” with an 40% opacity and cursor will show the sandclock. All links would be unclickable till the sorting progresses are completed each time.

Download

Sample code can be downloaded via here.

If you are developing web applications for different customer scenarios in which timestamping matters, there is a chance that you will be asked to put a real-time dynamic clock on the page depending on your real estate limitations on the UI. Any search result would give you several remedies to this purpose, but I wanted to have something short, neat and cross-browser compatible.

Here is the solution that I came up with by using an UpdatePanel and a few lines of JavaScript code.

First, create the UpdatePanel as in the following sample form:

OnLoad event of upDynamicClock will be handled in the server side:

Create a listener function (DisplayDynamicClock) by using the native setInterval function of JavaScript in order to update the content of lblDynamicClock and tell the page to run this function via window.onload:

Notice the usage of “__doPostBack” function as a bridge between JavaScript and ASP.NET for triggering a postback at upDynamicClock.

Conclusion

I have tested the outcome with the latest versions of IE and Firefox, and it worked fine with both of them:

Download

Sample code for this post can be found here.

Introduction

LINQ to XML is a new way to play with the XML data in .NET 3.5. It is actually an XML programming API that simplifies dealing with XML documents without any need to know about additional syntaxes such as XSLT and XPath. It is designed to be a cleaner, faster and lightweight API which at the same time has the key features from XSLT and XPath. According to MSDN, its public data model is aligned as much as possible with the W3C XML Information Set.

Sample XML Data and Its Filtering with “LINQ to XML”

For sampling purposes, I just created the following XML data and add it to my demo project:

My purpose is developing a simple ajaxified web application that has a dropdown with the country names and a literal that shows the capital city of selected country name from this dropdown. For this purpose, I created my server controls with some AJAX flavor as:

Then, I organized the Page_Load event as in the following in order to query over Countries.xml:

Pay attention to the usage of XDocument class from System.Xml.Linq namespace (which is already defined in the web.config file as default) in order to load the local Countries.xml file and the new casting and access methods (such as .Descendants and .Element that I used above).

Finally, after compilation the result on the browser should be like:

When “Belgium” is selected from the dropdown, literal will show the following with a partial rendering:

Conclusion

I generally work with SQL Server or Access in the data layers of my web applications, therefore I barely had a chance to put my hands on XSLT and XPath deeply. But, I can say that “LINQ to XML” as a data provider seems enough even powerful for me to handle many common XML programming tasks inside my code.

Download

You can download the demo project via here.