How to integrate help file in ASP.NET Application

No.of Views1049
Bookmarked0 times
Downloads 
Votes0
By  NikhilJohari   On  24 Aug 2010 09:08:40
Tag : ASP.NET , HTML and CSS
Help is a most important part our web applications, as mostly we doesn’t notice it, but sometimes is plays a very big role for saving our time and work.
emailbookmarkadd commentsprint

Images in this article missing? We recently lost them in a site migration. We're working to restore these as you read this. Should you need an image in an emergency, please contact us at info@codegain.com

 

Introduction

Help is a most important part our web applications, as mostly we dosen’t notice it, but sometimes is plays a very big role for saving our time and work.Suppose of a button having only an image, many times we are not able to understand what does it means but when we place mouse pointer over it, it shows the usage of that as a tooltip, which is a part of web help technique.
Many times when we read a topic that contains special words, definition then don’t we have to search on net about it, just we click and a small window opens with the description this is also a part of “help” for web applications.


So here I’m going to explain some techniques  How to add help to web applications.

Displaying ToolTips

ToolTip is a very basic and very important part of web, as I discussed in the intro.“Suppose of a button having only an image, many times we are not able to understand what does it means but when we place mouse pointer over it, it shows the usage of that as a tooltip”.

About

Tooltip shows at runtime, almost all “server” controls having this (tooltip) property inbuilt.One important thing about tooltip is that Internet Explorer dosen’t accepts the “tooltip” property of asp.net controls it takes this property as “title”.

In HTML controls you have to use the “title” property instead of “tooltip” for controls to show the help.

Server control

Code

<asp:ImageButton runat="server" ID="imgbutton" ToolTip="This is an eye,Click here to enter in web" ImageUrl="~/Lilac_by_KinkyPink.jpg"/>

 Output 

Image Loading

Html control

Code

<input type="image" title="This is an amazing eye" runat="server" 
 src="Lilac_by_KinkyPink.jpg" style="height: 46px; width: 64px"/>

Output

look like same as server control.

Displaying help in a popup window

Some times while discussing a long term, we use some keywords that include long definitions and difficult to understand for a newbe, for this purpose popup window can be used for a help purpose, it can be a html page or an .aspx page-depends on your need.

Code

<a href="#" onclick="window.open('procedure.htm','popup','left = 900 height=200,width=200,scrollbars=yes'); return(false);"> Procedure </a>are the most important topic of SQL.

Explanation

We have used # in href to give the current page reference and we used a onclick to open a new window “procedure.htm” which we have already created.“Left = 900” is the pop window position and further are some properties.Here procedure keyword is a link and rests are simple chars.

Output

When you click on the “Procedure” keyword it will open a new window containing the text entered in that page “procedure.htm” by you.Try it.

HTML help

If you have HTMLHELP.chm created in your system then a simple link can be used to pop it up any time.

Download “HTML Help Workshop” for this type of help feasility. You can download it from here for free:http://www.microsoft.com/downloads/details.aspx?FamilyID=00535334-c8a6-452f-9aa0-d597d16580cc&displaylang=en

Note:i assume you also going to install.

Now follow these steps to create a HTML help workshop for a project, website etc.
Starts –> All Programs – HTML Help Workshop – HTML Help Workshop.

 

Image Loading

Now click on the “New” toolbar.A new window will open like this.

 

Image Loading

Select Project then click OK button.

 

Image Loading

Click on the next button to proceed.

 

Image Loading

Browse the location where you want to create the file, just give a name and click open.Click on the next button again.

Image Loading

Don’t check any check box if you haven’t create any file.Click on the next button and then click on the finish button then a new window will appear like this.

Image Loading

Just use these buttons to make your help project.When you have done all the editing for creating help project click on this “Compile HTML file” button and then give the path of that .hhp file.

 

Image Loading

Compile the project.

 

Image Loading

Now see that a helpfile.chm has created on that location.Done.

Conclusion

We learned how to use Help techniques for web applications.

 
Sign Up to vote for this article
 
About Author
 
NikhilJohari
Occupation-
Company-
Member Type-Senior
Location-India
Joined date-15 Aug 2009
Home Page-http://fast-get.com
Blog Page-http://dotnetask.blog.co.in
 
 
Other popularSectionarticles
Comments
There is no comments for this articles.
Leave a Reply
Title:
Display Name:
Email:
(not display in page for the security purphase)
Website:
Message:
Please refresh your screen using Ctrl+F5
If you can't read this number refresh your screen
Please input the anti-spam code that you can read in the image.
^ Scroll to Top