Tips & Tricks for ASP.NET, IIS, and Visual Web Developer : Visual Studio 2008

Tip#97: Did you know… How to Display Hidden Information in Design View

WebDevTools — Thu, 01 Oct 2009 03:20:01 GMT

The design view in Visual Studio can display glyphs and borders for the hidden non - graphic elements (such as div, span, form, and script elements). This feature helps you to see where the elements are and avoid inadvertently deleting the non-graphic elements from your page while editing.

To enable it in designer click on View -> Formatting Marks -> Show

Now you will start seeing the hidden elements on the designer surface.

Hope this helps,

Deepak Verma
SDET | Visual Web Developer

Tip#96: Did you know…You could publish your SQL databases using the SQL Publishing Wizard?

WebDevTools — Mon, 28 Sep 2009 02:05:51 GMT

You can use the SQL Publishing wizard in VS 2008/VWD 2008 to deploy a local database from your development machine to a hosting environment on a remote machine.

This is how you will accomplish this:

Step 1: Create a new web site by selecting menu File ->New Web Site. Switch to Server Explorer and add a new Data connection and connect to a database. In this case we will use the Northwind database that comes with SQL Express. You should point to the database you want to publish.

Step 2: Select Northwind.dbo node in Server explorer and right click to bring up the context menu. In the Context menu you have a “Publish to provider…” option.

Step 3: Click “Publish to provider …” to launch the Database Publishing Wizard.

Step 4: Click Next to select the mode. Let us go with “Script to file” mode. We will need to specify the .SQL file name and location.

Step 5: Click Next and you will get to the Publishing Options. On this page, select the script for target database (SQL Server 2000 or SQL Server 2005) and the types of data to publish (Schema, Data or Schema+Data). You also have the option to drop existing object in script if you want to.

Step 6: Keep the default selection and hit next and generate the .SQL script.

Step 7: The .SQL file generated contains a script that you can run on any SQL server to re-create all the tables, sprocs, views, triggers, full-text catalogs, etc. for a database, as well as import and add all of the table row data that was in the database at the time the .SQL file was created.

Step 8: The .SQL file is a plain text file. You can open it in your favorite editor and customize it as you need.

Step 9: Now that we have our .SQL files, we can go about using them to install our database at our hoster. Exactly how to install the .SQL files will vary depending on how the hoster give access to our SQL account. Some hosters provide an HTML based file-upload tool that allows you to provide a .SQL file - which they will then execute against the SQL database you own.

Other hosters provide an online query tool (like below) that allows you to copy/paste SQL statements to run against your database. If you have a hoster which provides an online query tool like this, then you can open the .SQL file with a text-editor and copy/paste the contents into the query textbox and run it.

You can find my original post here.

Reshmi Mangalore
SDET, Visual Web Developer.

Tip #92: Did you know … How to select a master page using 'Select a Master Page' dialog?

WebDevTools — Fri, 21 Aug 2009 23:02:20 GMT

Master page for a Web form can always be set manually in the source code, but here is an option to select the master page while create the webform using the 'Select a Master Page' dialog.

The path to select a Master page using the 'Select a master page' dialog is different for a Web application project than for a Web site.

For a Web Application project:

Right click solution explore. Select Add and then select New Item
From the Add new Item dialog select Web content form and click on Add button.
Select a Master Page dialog would appear. Navigate thru the project folders to select the Master page & click on OK button. The aspx added would now be using the selected master page.

For a Web site project:

While adding a Webform, check the select master page checkbox and click on the Add button.
Select a Master Page dialog would appear. Navigate thru the project folders to select the Master page & click on OK button. The aspx added would now be using the selected master page.

Hope this helps,

Deepak Verma
SDET | Visual Web Developer

Tip #86: Did you know… Visual Studio has several different search options?

WebDevTools — Tue, 30 Jun 2009 23:24:00 GMT

The standard methods for searching can be found under the Edit --> Find and Replace menu.

The “Quick Find” method (Ctrl+F) allows users to search inside of the current document, all open documents, the current project, the entire solution, and the current block by changing the Look in selection.

If you set Look in to be the current project or the entire solution, Visual studio will open files that have matches as you navigate between matches.

You can also adjust the settings under Find options to make the searches more specific by having them match on case or whole words or control how it searches by deciding whether it should search up or down or if it should look at hidden text (collapsed regions).

The Find in Files method (Ctrl+Shift+F) allows users to see all the occurrences of the search in one place, changes the Look in options by removing the current block, but allows users to search custom locations by using the “…” button next to the Look in drop down, and allows the user to restrict the types of files searched.

If you use Ctrl+F or select the Quick Find option from the find and replace menu by mistake, hitting Ctrl+Shift+F or selecting the drop down in the upper left corner of the dialog and selecting Find In Files will quickly get you to the Find in Files dialog.

Using the Result options section you choose to have the results displayed in either the “Find Results 1” or “Find results 2” window. Allowing you to switch between results if needed.

The Find What field also keeps a history of searches. To access this history click the down arrow of the Find What field. You can avoid using the history or typing search terms by having the value you want to search for selected in the editor before opening one of the find dialogs.

Ben Byrd
SDET | Visual Web Developer

Tip #84: Did you know… How to set a Start page for your Web Site in Visual Web Developer?

WebDevTools — Sat, 27 Jun 2009 01:49:00 GMT

As you are developing your site, you may want to start at a particular page for testing your web site. By defaults, when you start debugging, Visual Studio runs the page that was currently in focus in your designer.

If you set this page, Visual web Developer will start your web site with the Set Page and not the current page in designer.

You can do this by right-click on the page and selecting Set As Start Page option from the context menu.

This could also be set in Properties page under the Start Options tab as shown below.

Enjoy!

Reshmi Mangalore

SDET, Visual Web Developer

Tip #82: Did you know... How to migrate Visual Studio 2005 Web Application Project to Visual Studio 2008

WebDevTools — Fri, 19 Jun 2009 02:32:56 GMT

Following steps highlight how a Visual Studio 2005 Web application project can be migrated to Visual Studio 2008.

Take backup of the original project
Open Visual Studio 2008
Click File -> Open Project and browse to the folder to open the project
You will receive the following conversion wizard to help you convert the solution or project to the current version. Click Next.
Select Yes on this screen if you want the wizard to help you to take the backup, otherwise select No and Click Next.
Be sure to read the summary on this screen & click finish
As soon as you click finish, you will see an upgrade prompt. Click yes if you want to upgrade to the latest framework otherwise Click No. If you select yes to upgrade, the project file as well as web.config file is updated for the latest framework. It's recommended to select the checkbox to do the same for all webs in this solution.
The conversion wizard would show you the status, select Show the log to see the log and click close.

For projects using Ajax you might need to install ASP.NET Ajax Extensions 1.0 in VS 2008 if you said no to upgrade. Please see Tip #62 to learn how to install it.

Hope this helps,

Deepak Verma
SDET | Visual Web Developer

Tip #81: Did you know... How to Select the CSS Schema for Intellisense and CSS Properties?

WebDevTools — Thu, 18 Jun 2009 21:56:52 GMT

In Visual Studio 2008, there is a Style Sheet Toolbar (visible only when a CSS file is active) which allows the user to select a CSS Schema, as seen in this screen shot:

However, this setting only affects the CSS editor, not the Intellisense in aspx or html files, nor the properties/values displayed in the CSS Property Grid, as shown here:

Setting the CSS schema for aspx/html pages is actually a bit obscure; in VS 2008 the current CSS schema in use is deduced rather than selected, and the setting is not displayed. The CSS schema is selected to complement the HTML schema, selected via the HTML Source Editing Toolbar, as shown below:

Selecting a “Target Schema for Validation” in the HTML Source Editing Toolbar implicitly selects a corresponding CSS schema, which is used in all aspx/html and similar documents opened in the web designer (documents with Design/Split/Source buttons displayed at the bottom of the window.)

Here is the table of correspondence for Visual Studio 2008:

HTML Schema	CSS Schema
Internet Explorer 6.0	Internet Explorer 6.0
Internet Explorer 3.02/Netscape Navigator 3.0	CSS 1.0
Netscape Navigator 4.0	CSS 2.1*
HTML 4.01	CSS 1.0
XHTML 1.0 Transitional	CSS 2.0
XHTML 1.0 Frameset	CSS 2.0
XHTML 1.1	CSS 2.1

* For Netscape Navigator 4.0, no CSS schema is specified, but CSS 2.1 is used.

Hope this helps!

Van Kichline

SDET | Visual Web Developer

Tip #80: Did you know… How to show JScript validation errors as warnings?

WebDevTools — Mon, 15 Jun 2009 21:54:00 GMT

With Visual Studio 2008 RTM, JScript validation setting is an option on the HTML validation page on the Options dialog. Since Visual Studio 2008 SP1 and later, we added a new option page JScript on the Options dialog, see the blog "Introducing JScript Formatting in VS 2008 SP1" for more detail. With this change, now the JScript validation resides on its own tab "Miscellaneous" as shown below:

To view JScript errors as warnings, we need to launch Options dialog from Tool -> Options menu, then expand Text Editor -> JScript -> Miscellaneous, check the checkbox "Show errors as warnings". Some users like to have JScript syntax errors shown in the Error List since it would encourage standard compliance, while others don't like to deal with validation errors since they are browser errors.

Anh Phan

SDET, Visual Web Developer

Tip #79: Did you know… How to quickly comment and uncomment in your web pages?

WebDevTools — Mon, 15 Jun 2009 20:36:00 GMT

Select the lines you want to be commented in your ASPX, HTML, web config file etc and click on the Comment/ Uncomment icon in Toolbar.

The comment icon looks like this:

The icon for uncomment looks like:

Alternatively you can use Keyboard shortcut Ctrl+K Ctrl+C to comment and use Ctrl+K Ctrl+U to uncomment.

Comments in ASPX page…

Comment in HTML page…

Comment in script blocks…

This shortcut is available under Edit Menu->Advance –>Comment Selection /Uncomment Selection.

Enjoy!

Reshmi Mangalore

SDET| Visual Web Developer

Tip# 78: Did you know… How to navigate using Document Outline?

WebDevTools — Fri, 12 Jun 2009 20:08:00 GMT

Document Outline window can be launched from the menu View -> Document Outline, or via short cut key Ctrl-Alt-T. The Document Outline window displays a nested, hierarchical tree of the elements and scripts on the page. It gives you a good overview of the page's content and its layout.

Double-clicking any element listed in the Document Outline window will highlight the corresponding markup for that element in the source view or the element display in the design view, depending on which view is currently open. This is very helpful in navigating a large, complex page.

More about Document Outline can be found here.

Anh Phan

SDET, Visual Web Developer

Tip# 77: Did you know… How to enable Page Level Tracing for your ASP.NET pages?

WebDevTools — Fri, 12 Jun 2009 01:58:00 GMT

Enabling tracing at page level gives you a bunch of information that can be useful while debugging your application.Tracing helps understand which control uses more view state, start/end of PreInit, start/end of Init, start/end of Render, etc. This information appears at the bottom of the page. By default page level tracing is disabled.

Tracing can be enabled at Page Level and also at Application Level

To enable Tracing at Page Level select DOCUMENT in Property grid and set it’s Trace property to true as shown below.

This will add Trace="true" in your page directive as shown below.

<%@ Page Language="VB" Trace="true" %>

You can also add TraceMode attribute to specify if you want the trace messages to be SortedByTime or SortByCategory.

You can now run the page and see the details as follows:

You can enable Application level tracing in the Web.config file of your application’s root. By doing this you will get trace information for all pages in your application. In this case you can set page level tracing to false if you do not want tracing information for particular pages.

<trace enabled="true" requestLimit="40" localOnly="false"/>

</system.web></configuration>

Remember to turn it off before you move your application to production. Also, know that the page level trace setting overrides the trace setting at the application level.

Enjoy Tracing!

Reshmi Mangalore

SDET, Visual Web Developer

Tip #76: Did you know… How to hide a non-visual control in your designer?

WebDevTools — Wed, 10 Jun 2009 02:36:35 GMT

Some times as you are building your web page, you may want to hide all the non-visual controls like Timer control so that the page looks close to how it would be rendered on your browser.

Our Designer can toggle between displaying and not displaying Non-visual controls using

Ctrl+Shift+N

Display ASP.NET Non-visual controls turned on:

Display ASP.NET Non-visual controls turned off:

This option is also present under View menu.

View->Visual Aids –>ASP.NET Non-visual controls as shown below…

Enjoy!

Reshmi Mangalore

SDET| Visual Web Developer

Tip #74: Did you know…How to Add and Remove AJAX Extenders in Visual Studio 2008 Designer?

WebDevTools — Sat, 06 Jun 2009 04:25:00 GMT

Tip#62 showed you how to add an AJAX Control Toolkit to your Toolbox.

Once you have the toolkit here is how you proceed:

1. Switch to Design View of the page and drag drop ScriptManager control from the AJAX Extensions tab of toolbox to the designer.

2. Drag drop an asp button control to the designer to which you would want to add the extender.

4. Select the button control and click on the Smart Tag. This will bring up the

Add Extender.. option.

5. Now click on Add Extender….This will bring up the Extender Wizard as shown below. Pick ConfirmButtonExtender and click Ok. Alternatively you can drag drop the ConfirmationButtonExtender from your toolbox on to the button control on your designer.

It is interesting to note that on adding an extender control, Visual Studio’s property grid displays the extender properties. Set the Confirm Text property for the extender to be “Are you sure?”.

6. Run the page and see that on clicking the button, you get a confirmation box as shown below.

7. To remove, select the control and bring up the Smart Tag and click on the Remove Extender option in the Smart Task Menu. This will bring up the Remove Extender dialog.

Click Remove and click Ok to remove the extender from your button control.

Enjoy!

Reshmi Mangalore

SDET, Visual Web Developer

Tip #69: Did you know…The keyboard shortcut for View in Browser?

WebDevTools — Mon, 01 Jun 2009 00:27:35 GMT

Ctrl +Shift+W does the trick for you.

This short cut is mentioned under File Menu -> View in Browser.

So if you are still using Select File -> Right click for context menu and then selecting View in Browser as shown below, you may want to start using Ctrl+Shift+W.

Reshmi Mangalore

SDET, Visual Web Developer

Tip #68 Did you know… How simple it is to attach an existing style sheet to your web page?

WebDevTools — Mon, 01 Jun 2009 00:19:01 GMT

Open an existing web site in VWD. Open the page by double clicking on it in solution explorer to which you want to attach the existing style sheet in your web site.

Now, switch to Design View of the page and bring up Select Style Sheet dialog by clicking on menu: Format –> Attach Style Sheet as shown below.

Click the OK button and this will add a link to the Style sheet that you selected in the Select Style Sheet dialog. Now you can make use of all the styles described in this style sheet.

<head runat="server">
    <title>Untitled Page</title>
    <link href="StyleSheet.css" rel="stylesheet" type="text/css" />
</head></PRE< P>

Alternatively, you can just switch the page to which you want to add the link and Drag Drop the style sheet from solution explorer to the page in which you want to make use of the styles. The drag drop action adds the above piece of code to source view.

Reshmi Mangalore

SDET, Visual Web Developer