Personal Blog of Mustafa Basgun

Manual Sorting with ListView by Using Drag and Drop

leave a comment »

Introduction

I have been following Matt’s jQuery related posts, and trying to get myself familiar with this new library. While searching for tutorials about it, I accidentally found this great blog. Accident followed by another accident, I figured out that one of their JavaScript posts can be applicable to the ListView control in order to create a “drag and drop” based manual sorting within the items of the ListView.

• I strongly suggest reading the original post first before passing to the rest of this post.

Implementing The Original Post…

As a data source, I just grabbed the XML file that I used before in here, and simplified it.

Here is the CSS implementation of the original post into my sample ASPX page:

And then, I created the DIVs programmatically by using a ListView as in the following:

If you look at the JavaScript.js file that I used in my sample code, you will see that the load function has been commented since I needed to create the “dragObject” objects dynamically in that function:

As a result of this, I organized the Page_Load event as:

Download

You can download the sample application via here.

Written by Mustafa Basgun

June 30, 2008 at 6:00 PM

Maintain Scrollbar Position Inside UpdatePanel After Partial PostBack

with 42 comments

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:

mustafa-basgun-blog-maintain-scrollbar-inside-aspnet-updatepanel-1

Update

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

Written by Mustafa Basgun

June 9, 2008 at 3:28 PM

Enhancing Paging in ListView by Using DataPager

with 3 comments

DataPager is one of the new controls in ASP.NET 3.5, and it provides paging functionality for data-bound controls that implement the IPageableItemContainer interface, which is only the ListView control for the time being.

By default, DataPager has two commonly used paging styles:

• Numeric Pager via NumericPagerField

• Next and Previous Pager via NextPreviousPagerField

To get an idea about how to implement these basic common styles, you can read this post.

This post will explain how to enhance the paging experience in a ListView by using both a NextPreviousPagerField and a DropDownList which will enable users to select the page size of ListView. This page size is actually the PageSize property of the DataPager, and this property defines the number of records that are displayed for each page of ListView.

To avoid complexity, the following simple XML file (Contacts.xml) will be used as a data source:

And, the XMLDataSource that consumes this XML file is:

“xdsDemo” is the DataSourceID of the ListView “lvDemo”:

After getting this data binding done, LayoutTemplate of “lvDemo” should be similar to the following:

Even though it is not completely related with the topic and emphasis of this post, ItemTemplate and AltenatingItemTemplate templates of “lvDemo” are:

Finally, here is the code that sets DropDownList (ddlDemo) and DataPager (dpDemo):

As a conclusion of all these things, the result on the browser should be like:

Download

Sample code for this demo application can be downloaded via here.

Written by Mustafa Basgun

May 7, 2008 at 10:30 AM

Update Title and Meta Tags Dynamically in ASP.NET

with 3 comments

If you are using master pages, updating your title or meta tags (such as “description” and “keywords”) may become an important subject because of the SEO purposes. Since there are several ways to accomplish this, here is my way in C# to do so.

Written by Mustafa Basgun

April 30, 2008 at 8:00 AM

Posted in ASP.NET, C#, SEO, Web Development

How to Fix Audible Alert Issue with The Reminder in WM 6.0

with one comment

I have been enjoying my HTC S620 for the last couple of months, but there has been a small problem with my audible alerts when I set an appointment in my mobile calendar. The reminder has been just vibrating, not playing a sound even though I have set the right things for my “Normal” profile to get an audible alert. After a short googling, it turned out to be a bug in Windows Mobile 6.0 (maybe for 5.0 as well).

Thanks to Karl Gechlik that this small but important bug has a fix in this link. He simply explains a workaround about altering the XML file of the profile in order to solve the problem. It seems to be working for me at this time.

Written by Mustafa Basgun

April 27, 2008 at 2:00 PM

Posted in Mobile Experiences

Rotate Array by N Position – Via Programming Pearls

with 2 comments

Lately, I have been trying to finish reading the Programming Pearls written by John Bentley. The chapters related with designing and developing algorithms are really entertaining. One of the questions that was discussed in the early chapters of the book was about an algorithm of rotating a one-dimensional vector, and I want to share my solution written in VB.NET and C# by utilizing a simple string array.

Question (with the terms of an array)

Rotate a one-dimensional array of K elements from left by N positions.
For instance, with K=7 and N=3, the array {a, b, c, d, e, f, g} is rotated to {d, e, f, g, a, b, c}.

Solution

As suggested in the book, I will be using the Array.Reverse method. I will also write the function that rotates an array from right as well in order to carry out the discussion further.

In VB.NET – Rotate By N From Left

In C# – Rotate By N From Left

In VB.NET – Rotate By N From Right

In C# – Rotate By N From Right

Page_Load of an ASP.NET environment would be a good place to test and visualize the results in this case.

In VB.NET

In C#

Finally, results on the browser should be like:

Written by Mustafa Basgun

April 11, 2008 at 6:00 AM

Posted in C#, VB.NET

What I Have Learned So Far While Developing My First Mobile Website

leave a comment »

As I mentioned in my previous post, I did have a chance to develop a very simple ASP.NET application for my mobile browser about a week ago. It was actually just an experiment for me to play around, and dealing with these topics is a new hobby of mine nowadays. Here is the design related list of elements that I have figured out.

• Simplicity is the key for the best user experience.

Complex designs utilizing nice navigations and high quality graphics are fine with the regular websites, but not with the mobile ones. Complicated components on the UI generally makes the mobile websites difficult to read. I would concentrate on the functionality first, and then try to add some design figures as modest as I can by keeping in mind that the screen size is limited.

• Alternate texts can be a redeemer.

There is an option to choose not to load the images, and there may be some users selecting this option. Therefore, it would be a good practice to put expressive alternate texts to the images.

• AJAX is good friend of mobile IE.

Fortunately AJAX is supported by the mobile version of IE in Windows Mobile 6.0. Using asynchronous JavaScript and XML would be a neat choice in some scenarios.

• Ads should be well-balanced with the real estate of UI.

I would avoid using large ad graphics which may need some amount of time to be downloaded. They may also conflict with the usability of the pages.

Some Useful Readings

• Internet Explorer Mobile HTML Elements
http://msdn2.microsoft.com/en-us/library/bb415489.aspx

• Internet Explorer Mobile CSS Support
http://msdn2.microsoft.com/en-us/library/bb415434.aspx

• Support for the WIDTH Attribute on Tables
http://msdn2.microsoft.com/en-us/library/bb415484.aspx

Written by Mustafa Basgun

April 5, 2008 at 11:00 AM