Telerik blogs

Introduction

My name is Jeffrey T. Fritz, and I am a developer who has been working with Asp.Net since the 1.0 days of 2002.  I’ve built web applications of all sizes for all form factors, and included localization features in those applications.  As an experienced developer, I’m also a rookie with Telerik’s ASP.Net AJAX controls.  To assist others who might be in a similar situation, I’m going to write a series of posts here that share my experiences in getting started with the ASP.Net AJAX controls.  I’ve primarily used the default controls that Microsoft distributes with Visual Studio, and thought to myself that using these controls would be a similar experience.  Please understand, I’m a developer who starts coding first, and reads product documentation later.   You should see how I assemble IKEA furniture... 

My first failed attempt to add controls to a project 

I started my experience with the controls by jumping right in to starting a new WebForms project.  My first attempt to use a control was to replace the default menu with the RadMenu.   To accomplish this, I dragged the RadMenu directly from theBad news.. a typical asp.net white error screen Asp.Net toolbox into the source for the MasterPage and removed the default menu.  I then started debugging my sample project and was greeted by yellow screen after yellow screen full of errors that I couldn’t explain.  Confused, I gave in and began to read the documentation to be sure I didn’t miss anything.  It was then that I discovered that there are two approaches to start using the controls with your project.  Let’s see where I made my mistake and how to get started in a more productive manner.

Adding controls to a new project

After installing the Telerik controls with their Visual Studio integration pieces, the “New Project” dialog in Visual studio contains some new entries for us:Asp.Net Project Template List
What is a RadControls Web Application?  You may already be familiar with creating an ASP.NET Web Forms Application, and ASP.NET MVC Web Applications, but why is there a new entry for a web application that uses a set of controls that I just installed?
The answer is easy:  this is a list of base-line project templates.  You are never committed to staying within just the content or structure presented when you start writing an application.  As such, the “RadControls Web Application” template is a web application template with a built-in wizard to assist in configuring all of the great extensions that are available in the AJAX toolset.
The output of this wizard is a collection of settings added to your project’s web.config file, a series of new project references that looks similar to the following figureTypical initial RadControl Project structure, and a collection of content files copied into the project.   The WebForms developer in me was astonished the first time I saw this project structure, thinking: “Where is my default Account management content, jQuery references, and cool OAuth capabilities that I expect in my default WebForms application?”  The image to the right is a snapshot of the contents of this project template that I originally felt was lacking.  After some research, I realized that the RadControls project template was aligned with the “Empty Application” template.
If you’re like me and would prefer to start working with an ASP.NET WebForms project that has all of the default content so that you don’t have to re-write account management or re-add the default NuGet packages, you can add the controls to the default project in the same way that a user would add the controls to an existing project. 

Adding controls to an existing project

Fortunately, we do not need to track down all of the settings in the RadControls Web Application template and migrate them to our existing project.  Telerik has already put together a configuration wizard that will perform this task for us.  To access the wizard and add the correct control references to your existing project follow these steps:  
• Right click on the project name in the solution explorer OR from the Visual Studio “Telerik” menu
• Select RadControls for ASP.Net AJAX 
• Click through to the “Convert to Telerik Web Application” option.  

Convert Project Menu Item

This will launch a configuration wizard that is similar to the wizard presented when starting a RadControls Web Application from scratch.  Answer all of the questions presented and the same Telerik RadControls configuration entries will be added to your existing web.config file.  
Default project with a RadMenu installedMy test project was missing all of these references to the Telerik libraries and configuration options.  Once I ran through these steps to correctly configure my test project, the yellow screens went away.  I was finally able to see the default project content with a RadMenu replacing the default menu in the application: 

Conclusion

I hope this clears up any confusion you may have had while attempting to start working with the AJAX controls.  We clarified how to add the controls to a new project and reviewed how to add them to an existing project.  In my next post, we will describe and start working through a real project that uses many of the controls in the ASP.Net AJAX control set. 

About the Author

Jeffrey T. Fritz

Jeffrey T. Fritz is a Microsoft MVP in ASP.Net and an ASPInsider with more than a decade of experience writing and delivering large scale multi-tenant web applications. After building applications with ASP, ASP.NET and now ASP.NET MVC, he is crazy about building web sites for all sizes on any device. You can read more from Jeffrey on his personal blog or on Twitter at @csharpfritz. Google Profile


Comments

Comments are disabled in preview mode.