An ASP.NET Blog

Control does not implement IPageableItemContainer Error

Harish Ranganathan — Thu, 05 Jun 2008 07:48:29 GMT

You may run into this error when trying to use the new DataPager control with a GridView or any other control, other than the ListView control. For a moment I couldn't believe that the DataPager cannot work with the GridView control. Then after a few moments of research found out that, the Data Pager control requires the Data Control to implement the "IPageableItemContainer" interface. This is a part of the System.Web.Extensions namespace that is shipped with .NET 3.5.

This interface is currently implemented only by the List View control. If you arent aware, ListView and Datapager are the new server controls in ASP.NET 3.5.

So, the solution is to use the Data pager control in combination with a List View control.

To read more about the "IPageableItemContainer" interface, check http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.ipageableitemcontainer.aspx

Using the Data Pager control with List View

The List View control is new in ASP.NET 3.5. It allows you to customize the output that is rendered by the data control. Traditionally a DataGrid / Grid View control renders HTML Tables which can be a little heavy over the internet. The List View allows you to define the Layout Templte and Item Template and optional Alternating Layout Template, Empty Data Template etc.,

Configuring the ListView Control

1. Start Visual Studio 2008 and select "File - New Website".

2. Chose ".NET Framework 3.5" in the dropdown on the top right of the "New Website" dialog and click "Ok"

3. It creates your Website and a Default.aspx is created.

4. Open the Default.aspx page and from the ToolBox, drag and drop a ListView control in the design view (The ListView control is under the "Data" section in the ToolBox. If you dont find it, make sure you selected the ".NET Framework 3.5" as the version as mentioned in Point 2 above. Since this control is new in ASP.NET 3.5, it wont be available if you had selected ".NET Framework 2.0" or .NET Framework 3.0" in the "New Website" Dialog.)

5. In the Design View, click the smart tag that appears next to the ListView control and select "DataSource" and chose "New DataSource" and then chose "Database" as Data Source Type

6. You can provide an ID under the "Specify an ID for the data source" textbox or leave the default one. Click Ok

7. In the "Chose your Data Connection" dialog, chose an existing connection or you could also create a "New Connection" by providing the necessary paramters, test the connection and click "Next"

8. Click "Next" and make sure you selected "Yes" under "Do you want to save the connection....." so that the connection string gets saved in the web.config file.

9. In the next screen you can chose an existing table or create a SQL procedure and do all the conditions / filtering that you want to apply.

10. Click "Finish" in the next screen to complete the Data binding process.

11. At this point if you try running the site, you would get an error contrary to the case with a DataGrid or a GridView since, both these controls just require the steps upto 10 above to start rendering the Data.

12. However, for the Listview, control we need to define the ItemTemplate and LayOutTemplate. We can either define them manually or use the Visual Studio desinger to do that.

13. Go back to the ListView in the Design Mode and click on the smart tag and click on "Configure ListView"

14. In the "Configure ListView" dialog, you can select a LayOut as well as Style. While the default is Grid, chose a Bulleted List or Flow Layout so that it can render lighter HTML accordingly.

15. Later you can switch back the Layout by again configuring the ListView. You can also manually define the Item Template and the LayOut Template.

Configuring the DataPager Control

1. Once you are done with the ListView control, you can either chose "Enable Paging" and select "Next/Previous" or "Numeric". When you select this, it automatically generates the DataPager control with the following settings:-

<asp:DataPager ID="DataPager1" runat="server">
                        <Fields>
                           <asp:NextPreviousPagerField ButtonType="Button" ShowFirstPageButton="True"
                                ShowLastPageButton="True" />
                        </Fields>
                    </asp:DataPager>

2. Since this is automatically placed within the "LayOut Template" of the ListView it automatically provides pagination for the ListView control.

3. You can also control the attributes of the DataPager such as PagedControlID, PageSize to manually control these settings.

4. The PagedControlID in the above case is automatically perceived as the "ListView1" within which the DataPager is placed.

5. The DataPager control can also be manually defined outside the scope of ListView1 and in that case, you need to manually set the "PagedControlID" to "ListView1" or whatever ID that is provided for the ListView control.

6. The PageSize is automatically set to 10 and you can manually override the same by providing the pagesize property.

7. The Fields need to be manually defined when the DataPager is manually added and configured to be used with the ListView control. There are 3 options, the "NextPreviousPagerField" or "NumericPagerField" or "TemplatePagerField". In case of "TemplatePagerField" you need to manually define the templates similar to custom paging. In fact it is custom paging implementation.

Once you have configured the above and when you run the page, the ListView appears with the DataPager control as configured and as you check the source, you would be able to notice that since we selected "Bullted List" an <li> markup is generated instead of HTML tables, tds etc.,

The ListView is one control that allows a great amount of customization of the output.

Scott Guthrie has written an excellent post on using the Listview to build a Product Listing page with screen shots which provides a great resource on using the List View and various customizations.

Cheers !!!

Web Development Helper Utility

Harish Ranganathan — Wed, 04 Jun 2008 13:18:36 GMT

Some of you who attended my recent Innovation Days and MSDN Sessions have asked for the URL for the Web Development Helper utility that I used during my demos.

Shamelessly, I am posting the link for download (shame, since it is not something I wrote and rather used an existing tool).

Well, you can download the same from http://projects.nikhilk.net/WebDevHelper/Default.aspx

The main site is http://www.nikhilk.net/ and you can find tons of useful information in this site. Nikhil is the Principal Architect in the US Developer Division and one whom we all admire for this sheer brilliance.

A good way to restart my blog postings isnt it

Cheers !!!

Web Control Library Template in Visual Studio 2008

Harish Ranganathan — Thu, 03 Apr 2008 08:29:35 GMT

If you are working with Visual Studio 2008, you might be looking for the Web Control Library template that used to be quite apparent in Visual Studio .NET 2003 and kind of hidden under "File - New - Project - Windows - Web Control Library" in Visual Studio 2005. Check my earlier post on this http://geekswithblogs.net/ranganh/archive/2006/09/06/90370.aspx

Well, in Visual Studio 2008, this option is under "File - New - Project - Web - ASP.NET Server Control". Yeah that is the place you you would find the template to create a Web Control Library.

Thought this was again tricky to figure out and would help if I post the details over here.

Cheers !!!

File Upload in UpdatePanel, ASP.NET AJAX

Harish Ranganathan — Wed, 02 Apr 2008 11:03:08 GMT

One of the common queries I get across my sessions is that, the File Upload control doesnt work inside an Update panel. All of us would like to implement a Gmail File Upload kind of interface and when you try to implement a similar thing using UpdatePanel (which works like a charm for other activities), it simply doesn't work.

The behaviour is expected. The File Upload Control doesnt work inside an Update Panel due to security reasons and restrictions a browser implies. They dont allow Javascript files to directly access the files in an user's sytem and dont allow to modify or access the details of a file when working with the File Upload Control.

There are a couple of ways to solve this issue, one using Update Panel and Post Back Triggers and the other using Iframes.

1. Use Update Panel, File Upload Control and use a PostBackTrigger Control to force a postback only for the File Upload Control

This approach works well without much tweaking except for that, there would be a postback only for the File Upload Control. While the rest of the stuff happens asynchronously, using the UpdatePanel, when the user presses the "Upload" Button, the page will be refreshed. Let us examine how we can accomplish this. Place the following code within the <form> </form> tags in your ASP.NET Page.

<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>

<asp:UpdatePanel ID="UpdatePanel1" runat="server">

<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>

<br />

<asp:Button ID="Button1" runat="server" Height="20px" onclick="Button1_Click" Text="Submit" Width="128px" />

<br />

<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>

<br />

<asp:FileUpload ID="FileUpload1" runat="server" />

<br />

<asp:Button ID="Button2" runat="server" Height="25px" onclick="Button2_Click" Text="Upload" Width="128px" />

<br />

<asp:Label ID="Label2" runat="server" Text="Label"></asp:Label>

<br />

</ContentTemplate>

<asp:PostBackTrigger ControlID="Button2" />

</Triggers>

</asp:UpdatePanel>

In the Code behind, add the following lines of code:-

protected void Button1_Click(object sender, EventArgs e)

{

Label1.Text = TextBox1.Text;

}

protected void Button2_Click(object sender, EventArgs e)

{

FileUpload1.PostedFile.SaveAs(@"C:\test\"+System.IO.Path.GetFileName(FileUpload1.PostedFile.FileName));

Label2.Text = FileUpload1.PostedFile.FileName;

}

If you run the above sample, you would notice that upon entering something in the TextBox and clicking "Submit" (Button1) the Label above the File Upload Content, shows the Text you typed, without a page refresh.

However, when you select a file and click on the "Upload" (Button2) Button, you would notice that a postback happens and the file gets posted to the "C:\Test\" folder and also the full path is specified in the Label 2.

In the above code, I have not taken any steps regarding validation, checking if file exists etc., since it just shows how you could accomplish File Upload within Update panel. In normal cases, you would write better code to accomplish a file upload feature.

2. Use Iframes and accomplish a truly Gmail Like File Upload Interface.

I thought of writing a post on this, but did a quick research and found that there are a few solutions posted by our MVPs / Community Folks and just thought of providing a link to the same.

http://vinayakshrestha.wordpress.com/2007/03/13/uploading-files-using-aspnet-ajax-extensions/

http://msmvps.com/blogs/luisabreu/archive/2006/12/14/uploading-files-without-a-full-postback.aspx

Note that this post doesnt claim any warranty / support for the above articles, though.

Cheers !!!

Mobile Web Forms in Visual Studio 2008

Harish Ranganathan — Wed, 02 Apr 2008 05:59:04 GMT

If you have worked with Visual Studio 2008 and tried creating Mobile Web Applications, you would have figured out that the "Mobile Web Form" template is missing. In the past, in Visual Studio .NET 2003 you had Mobile Web Forms that allow you to create webforms that can be rendered over different types of HTML, WML and XHTML capable devices.

Well, it is not shipped by default in Visual Studio 2008, but Omar Khan from the Web Development Tools Team has put up a few templates that can be downloaded and brings in those Mobile Templates required for creating mobile web applications.

You can download the templates from the Web Development Tools Team Blog Post here There is a "readme" file attached to each of the extracted Zip folders. But to make it simpler, once you install and unzip the package, you get a folder "ASP.NET Mobile Templates" and inside that you might find a bunch of folders.

Copy the Zip folders inside each of the "ASP.NET Web Application" Folders into your system's Visual Studio Templates folder. For instance, there is a folder for "ASP.NET Web Application CS". You need to copy the contents of this file into

c:\Documents and Settings\<username>\My Documents\Visual Studio 2008\Templates\ItemTemplates\Visual C#

Similarly you would copy the contents of the "VB" folder into the Visual Basic folder under "ItemTemplates" above.

Once you copy these and restart Visual Studio 2008, you would be able to get the "Mobile Web Form", "Mobile Web User Control" and "Mobile Web Configuration File" under "My Templates" in "Add New Item" Wizard.

Cheers !!!

Virtual Tech Days Bangalore India - April 9th & 10th

Harish Ranganathan — Mon, 31 Mar 2008 15:00:11 GMT

We are delivering Virtual Tech Days on April 9th and 10th (http://www.virtualtechdays.com) delivering a series of webcasts on different tracks ranging from SQL - BI to Visual Studio for Devices. Infact the three important tracks are SQL Server 2008, Visual Studio 2008 and Windows Server 2008.

These would be in depth sessions covering specific topics on each of the above products. For Visual Studio we have dedicated tracks for Application Development and Lifecycle management using Visual Studio 2008 and VSTS. We also have a Web Development track focussing on ASP.NET, AJAX, Silverlight and the recently released ASP.NET MVC Framework Beta. There would also be a track for Visual Studio for Smart client Apps including Mobile Devices.

You could find the detailed agenda at http://www.virtualtechdays.com/agenda.aspx The good thing that we have heard from you folks about webcasts is that, it doesnt require you to travel anywhere and take out time from your hectic work schedule. You could attend all of these from the comfort of your desktop and learn about the exciting technologies and their application in your projects.

The sessions are going to be delivered along with Quiz, Contests etc., and there are exciting gifts promized and believe me, I feel its one good time to be attendee than a speaker for this event.

The whole event would be hosted by Mandira Bedi.

So, for more information and registration visit http://www.virtualtechdays.com/registration.aspx

Looking forward to see you all in the Virtual Tech Days.

Adding Videos to web page using Silverlight

Harish Ranganathan — Mon, 25 Feb 2008 16:58:40 GMT

Well, if you are a regular reader of my blog, you would have noticed that I have recently uploaded a few videos on Visual Studio and ASP.NET AJAX, powered by Silverlight. A lot of you might want to upload your videos into your web pages, web logs, site etc., and would be wondering on where to upload the videos, how to host it etc., Also, some of you might be waiting to use Silverlight in your website. Well, this post (inspired with my own experience) helps understand on how you can achieve both (use Silverlight as well as host videos on your webpages) together.

The first thing that you would require to upload a video, is obviously the Video. You may want to start recording a screen capture of a simple "How-to" technical article or even on a yummy recipe that you tried. You could record the video using any screen capture tool or can try the free Windows Media Encoder Series

Once you are done with recording a decent size video (say of size 3-4 MB), you are all set to start publishing the video.

Encoding your Video for Windows Live Streaming using Expression Encoder

1. Download Expression Encoder for free

2. Open Expression Encoder, select "File - "Import" and chose the location where you have your recorded video

3. It shows the Imported Video under the Media Content section

4. Select Settings in the right and under Profile adjust the Video and Audio to reduce the size. Typically anything more than 25MB is going to have issues when using Silverlight Streaming. So adjust the settings accordingly.

5. Switch to the Output tab and under Job Output - Template - chose a template for the video. I chose the Silverlight Template which looks cool.

6. Once you are done with the above, click Encode to encode the video file for streaming

7. The Encoded file is typically stored in Documents folder under Expression\Encoder folders.

8. A folder is created for every encoded video

9. When you navigate to this folder, you might find the following files

i. BasePlayer.js

ii. Default.html

iii. Your WMV Video file

iv. MicrosoftAjax.js

v. player.js

vi. player.xaml

vii. PlayerStrings.js

viii. project.csproj

ix. Silverlight.js

x. StartPlayer.js

10. We need to add a Manifest file to the above files.

11. Create a simple .txt file and rename it to manifest.xml. Open it using any text editor and copy paste the following contents

<SilverlightApp>
<version>1.0</version>
<loadFunction>StartWithParent</loadFunction>
<jsOrder>
   <js>MicrosoftAjax.js</js>
   <js>BasePlayer.js</js>
   <js>PlayerStrings.js</js>
   <js>player.js</js>
   <js>StartPlayer.js</js>
</jsOrder>
</SilverlightApp>

Save this file

12. Secondly, you may not want the video to start playing automatically since it might be a little annoying for your visitors, particularly if there are more than a single video. To avoid this, you can edit the StartPlayer.js file and navigate to the section where it says autoPlay. It is set to true by default. Change it to false. This would make the video play after users click on the same.

13. Once you are done with the above changes, select all the files mentioned above (contents of the folder for this particular video) and Zip them. You would need to ignore the following files while zipping

i. Default.html

ii. Silverlight.js

iii. project.csproj file

14. The zipped file is what you would require to host your video

Silverlight Streaming

Silverlight Streaming is a free streaming resource provided by Windows Live Services It allows you to host upto 4GB Videos for free streaming and is an innovative approach since we take care of the streaming and hosting part. All one requires is a silverlight player installed on the client side to render your video.

You can get a Silverlight Streaming account for free from http://silverlight.live.com Once you create an account, visit the
Manage Applications section and select "Upload a Silverlight Application" link

You would require to provide a name which has no space (little annoying) without hyphen (even more annoying if you are used to using hyphens) and there after Browse to upload the zipped files.

Once you are able to upload the zip file successfully, you would get an URL with an iframe tag and the required properties.

Adding it to your website

Well, all you have to do is to copy the iframe URL provided in the Silverlight Streaming site and paste it into your blog template (switching to HTML View) / website.

Thats it, you could see that your videos are playing powered by Silverlight Streaming.

Happy Silverlight Streaming !!!

AJAX Enabling ASP.NET 2.0 Applications

Harish Ranganathan — Thu, 21 Feb 2008 13:57:38 GMT

Click Here for a text version of this article !

ASP.NET 2.0 PreCompilation Utility for Deployment

Harish Ranganathan — Thu, 21 Feb 2008 13:17:11 GMT

Click Here for a text version of this article

ASP.NET 2.0 Publish Website Deployment

Harish Ranganathan — Thu, 21 Feb 2008 13:07:05 GMT

Click Here for a text version of this article

ASPNET 2.0 MSI Deployment

Harish Ranganathan — Thu, 21 Feb 2008 12:57:47 GMT

Click Here for a text version of this article

Heroes Happen Here - Microsoft India Launch Visual Studio 2008, SQL Server 2008 & Windows Server 2008

Harish Ranganathan — Wed, 20 Feb 2008 14:03:26 GMT

Heroes Happen Here !!! Yeah that is the theme we chose for this launch. After all, arent you guys the Heroes, going out and solving the customer problems that keep creeping in day-to-day?

I had in my earlier post talked about the Visual Studio 2008, SQL Server 2008 and Windows Server 2008 and the sessions I am delivering over the same. Also, we have a community launch that happens across 14 cities. The agenda for the same should be out shortly at the Heroes Happen Here website, keep checking for the same.

Meanwhile, we also have an 80 City launch that would be delivered by our partners (you see, we can't be everywhere ) We are in the process of putting up the content, tracks and the venues for all the cities. Rest assured, its not fun, planning this event, but delivering this is going to be fun because, we are going to reach out to all the small cities and towns where we always encounter brilliant minds. Much as we presume that the IT Folks are from tier-1 cities, there are many cases, when we encounter experts from small towns.

The agenda for the 80 city launch, should also be up shortly in the website.

Post these events, we are going to have a virtual launch during which there will be day long webcast sessions on each product, one each for Visual Studio 2008, SQL Server 2008 and Windows Server 2008, that would happen. You can check for the agenda and registration at http://www.microsoft.com/india/webcasts The pre-launch webcasts are happening right now and if you missed my webcasts on Visual Studio 2008, Web Development and RIA development, you can download the recordings from http://www.microsoft.com/india/webcasts/ondemand.aspx

So, rest assured that you wouldnt miss the action and can always catch up with one of the above events. If you are attending any of these events, we would be glad to meet you and hear from you, your experiences.

Cheers !!!

Visual Studio 2008, Windows Server 2008 & SQL Server 2008 Launch

Harish Ranganathan — Thu, 14 Feb 2008 14:22:52 GMT

Yes, we would launch three in a row! Visual Studio 2008, Windows Server 2008 and SQL Server 2008 Launch would be happening on March 4th, 5th and 7th at Bangalore, Mumbai and Delhi respectively.

This launch marks one of the biggest launches we have ever done and we are working hard at it. There are a flood of events planned starting with our pre-launch webcast series happening starting next monday. You can register for the same at http://www.microsoft.com/india/webcasts/ (check the Visual Studio 2008 Webcast Series), and I am speaking on two of the web related stuff.

The next important dates to note are

March 4 Bangalore Launch

March 5 Mumbai Launch

March 7 Delhi Launch

I am speaking at all the above cities on Visual Studio 2008

Then there is the community launch happening in 14 cities across the countries. If you are a part of the UG in any of these cities, you must have received information regarding this.

You can register for all the events at http://www.heroeshappenhere.co.in/Register.aspx

For more information check http://www.heroeshappenhere.co.in/

Cheers !!!

You may receive the error "An authentication error occurred while communicating with the web server. Please see Help for assistance"

Harish Ranganathan — Fri, 01 Feb 2008 12:23:30 GMT

When working with Visual Studio 2005 on Windows Vista and create web applications running out of IIS 7, you need to perform a few steps before getting it work. I had blogged about it, in my earlier post

However, after performing all the above, you might still get "An authentication error occurred while communicating with the web server. Please see Help for assistance" when trying to create a website / debugging a website created using Visual Studio 2005 running on a Windows Vista with IIS 7.

There is a public hot fix available which can be downloaded for FREE.

The Web Dev Tools team put up a nice post on this http://blogs.msdn.com/webdevtools/archive/2007/06/20/downloadable-hotifx-f5-debugging-using-iis-fails-on-vista-home-editions.aspx

Also check http://mvolo.com/blogs/serverside/archive/2006/12/28/Fix-problems-with-Visual-Studio-F5-debugging-of-ASP.NET-applications-on-IIS7-Vista.aspx which provides better explanation with visual steps.

Cheers !!!

Running Visual Studio 2005 on IIS7, Windows Vista

Harish Ranganathan — Fri, 01 Feb 2008 11:57:25 GMT

If you are working with Windows Vista and IIS7 and developing web applications using Visual Studio 2005, you might want to know certain things before you panic on getting issues with creating http://localhost applications running out of the IIS Webserver.

With Windows Vista, we ensured that security is the utmost important aspect and anything that needs an administrative privielege (could be running a script, could be creating a website in your webroot or simply could be changing your desktop resolution) needs to be confirmed by the end users, triggered by the UAC prompt. If you had been working with Windows Vista, you would have noticed the UAC Prompt appear quite a few times for a number of things. This though looks to be a nuisance, is a wonderful mechanism to prevent fradulent usage of administrative access by hackers. Supposing you visit a site which internally downloads a script and tries to attach your OS System Files, unless the end user confirms, the UAC isnt going to allow to proceed with the operation. Similarly, even downloaded desktop applications which try to mess with the operating system, are well covered by the UAC prompt.

Coming to our case in point, for creating Web Applications running out of IIS7, you need to do a few things. The first thing is to run your Visual Studio 2005 under admin priveleges. You can do that by Start - Run - Visual Studio 2005 and right click on the Visual Studio 2005 icon and select "Run as Administrator". By doing this you get the privelege to create web applications running out of IIS 7. Alternatively you could also create web applications running out of your file folders without requiring the IIS 7. This doesnt require you to chose "Run as Administrator". In these cases, Visual Studio 2005 would use the built-in ASP.NET Server (http://localhost:PortNumber)

Similarly, at the IIS 7 end you need to do a few things. The first step is to enable IIS7, by default, IIS 7 is not enabled in Windows Vista. So visit Control panel - Add Remove Programs (a quick runtime command is "appwiz.cpl" from Run command). Select "Turn Windows Features On or Off" and you would be prompted with a list of Windows Compnents (It takes a moment to load the bunch)

Once you are there, you would just want to do the following things:-

1. Scroll Down to the Internet Information Services (its below Indexing Services and above Microsoft .NET Framework 3.0)

2. Expand the tree next to Internet Information Services by clicking on the '+' sign.

3. Expand the IIS 6 Management Compatibility icon

4. Under that, make sure IIS Metabase and IIS 6 compatibility is Checked (Selected)

5. Since we havent checked (at least they arent checked by default) all the items, it (IIS 6 Management Compatibility) would be grayed (blue-filled)

6. Also select IIS 6 Management Console as checked

7. Similarly, under World Wide Web Services -> Application Development Features make sure the following are checked

i. .NET Extensibility, ii. ASP.NET, iii. ISAPI Extensions, iv. ISAPI Filters

8. The World Wide Web Services icon would also be a grayed (blue-filled) check box.

9. Once you un-expand these and go back to Internet Information Services, you would find that it is also grayed (blue-filled) checkbox.

10. Click Ok and it would take quite sometime to install ASP.NET 2.0 and also install the features selected and configure them.

Post these steps, you should be able to run Visual Studio 2005 under administrative priveleges (Right click, Run as Administrator) and also created websites hosted on http://localhost (IIS 7 Webserver) as against creating them on your local folder structure.

Here below are a few blog posts which give a Visual Step-by-Step instructions incase you are unable to follow the above

http://weblogs.asp.net/scottgu/archive/2006/09/19/Tip_2F00_Trick_3A00_-Using-IIS7-on-Vista-with-VS-2005.aspx

http://blogs.msdn.com/webdevtools/archive/2006/09/18/761206.aspx

Cheers !!!