Recent Posts

Wednesday, February 25, 2009

How to show modal Dialog panel in (In normal pages or in Master Child web applications)

Show only a dialog panel disabling the other part of the page by pressing a button.
In this article i will show how can we use this feature for displaying a image and set background disabled.
This will be a very good tutorial for learning one more feature of Ajax.
Even grid and different other data can be shown on the modal dialog where then user can do some work and close the dialog box.

First you have to download Ajax control toolkit for 2.0

Now add the reference AjaxControlToolKit.dll to your web project. Learn how to develop a web application with Asp Master Pages

Please look at the image below and I will explain on how this works:

In the image I have done the following:

First of all i have registered AjaxControlToolKit and prefix it by cc1

%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>

I have added Script manager in between the content template of the detail page.

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

I have added two button because btnShowPopup will run for ModalPopupExtender as a client side control. Therefore i have disabled it. The other button btnTest is our control where we write the code to show the modal dialog panel or load any required data in the modal dialog panel and show the dialog.

asp:Button ID="btnTest" runat="server" Text="TestPopup" OnClick="btnTest_Click" />

asp:Button id="btnShowPopup" runat="server" style="display:none" />

Now I have added ModalPopupExtender from ajax tool kit and named it mdlPopup and it has targetcontrolID as btnshowpopup and popupcontrolID which it will show is pnlImage. Finally btnClose will close the modal

cc1:ModalPopupExtender ID="mdlPopup" runat="server"
TargetControlID="btnShowPopup" PopupControlID="pnlImage"

Now put the Panel where we want to display the modal and make it invisible at the beginning.

asp:Panel ID="pnlImage" runat="server" style="display:none;">
asp:UpdatePanel ID="upCities" runat="server" UpdateMode="Conditional">

Now put the label for Image name and the image and close the content template and update panel

asp:Label ID="lblImg" runat="server" Text="This is My Image">/asp:Label>
asp:Image ID="Image1" ImageUrl="~/images/logo.gif" runat="server" />


Now put the button that closes the dialog

asp:Button ID="btnClose" runat="server" Text="Close" Width="50px" />

Now close the panel tag

Now try running your application should work sweetly. Enjoy coding

Read more!

Tuesday, February 24, 2009

How to overload Constructor in

Constructors are the initialisation code of the classes or the objects that we use in Visual Basic .NET or in Visual Studio C#.NET or in Visual Basic.
In this short explanation I have used VB .NET code to explain how we can overload the constructor or have multiple constructors that can accept different parameters. Overloading helps to pass multiple paramaters to a method without using optional keyword in the method. If you overload the constructor of a class in visual basic or in c# .NET, you can initialize values for the properties of the class and which can later used in the class for performing various tasks.

Please look below where I have used the ConnectMe class where I have two constructors one has got string passed to it the other one doesn't have any parameter passed to it.

Here I have used the external connection string in one constructor to instantiate the connection string but in other constructor, if I don't get the connection string then I call the function ReadDatabaseConfig which in turn gets me the connection String.

By below example we can easily explain the use of overloading the constructor.

Public Class ConnectMe

    Public connStr As String = "" 

    Public Sub New(ByVal strConn As String)
        connStr = strConn
        If Not Connect() Then
            Exit Sub
        End If
    End Sub

    Public Sub New()

        If Not Connect() Then
            Exit Sub
        End If
    End Sub

End Class

Read more!