Home | HTML | Asp.Net | HTML Probe | .Net Probe
   
 www.solvingera.com 
  Contact Us |Sitemap
  

Ajax Toolkit in Asp.Net

  Skip Navigation LinksHome>Asp Home>Ajax tools

AlwaysVisibleControlExtender

AlwaysVisibleControlExtender enables you to fix a given control (or a set of controls) to one of the page control so that the corner appears to float in the background when the page is scrolled of resized. You can set the vertical or horizontal alignment of the control that will always be visible.

Control's Name An Example Code Snippet Description
Always Visible Extender <div>
<
asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<
asp:Panel ID="Panel2" runat="server" BackColor="#3333FF"> </asp:Panel>
<
cc1:AlwaysVisibleControlExtender ID="Panel2_AlwaysVisibleControlExtender" runat="server" Enabled="True" TargetControlID="Panel2" ScrollEffectDuration="0.8" UseAnimation="True"> </cc1:AlwaysVisibleControlExtender>
</
div>
This Code snippet shows a panel control that will remain at the top of the browser's screen when scroll the dcreen up and down.

AnimationExtender

The AnimationExtender server control provides a tremendous and sophisticated effect in an easy and declarative fashion. It enables a developer to add a fancy animation effect to your website. There are many events available for a programmer to programe the control’s animation. These events are given below:-
  • OnClick

  • OnHoverOver

  • OnHoverOut

  • OnLoad

  • OnMouseOver

  • OnMouseOut

Control's Name An Example Code Snippet Output
Animation Extender <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager>
<
asp:Button ID="Button1" runat="server" Font-Bold="True" Text="Animated Button 1" />
<
cc1:AnimationExtender ID="Button1_AnimationExtender" runat="server" Enabled="True" TargetControlID="Button1">
<
Animations>
<
OnMouseOver>
<
Color Duration=".3" StartValue="#CC0000" EndValue="#009933" Property="style" PropertyKey="color" />
</
OnMouseOver>
<
OnMouseOut>
<
Color Duration=".3" EndValue="#000099" StartValue="#FFCC00" Property="style" PropertyKey="color" />
</
OnMouseOut>
</
Animations>
</
cc1:AnimationExtender><br /> <br />
<
asp:Button ID="Button2" runat="server" Font-Bold="True" Text="Animated Button 2" />
<
cc1:AnimationExtender ID="Button2_AnimationExtender2" runat="server" Enabled="True" TargetControlID="Button2">
<
Animations>
<
OnHoverOver>
<
FadeIn Duration=".3" Fps="20"/>
</
OnHoverOver>
<
OnHoverOut>
<
FadeOut Duration="5" Fps="3" />
</
OnHoverOut>
</
Animations>
</
cc1:AnimationExtender>





CalendarExtender

CalenderExtender control enables you to display a calendar within a textbox. When a user clicks the textbox, a calendar template is open in which a user can select a date, month, and a year with a customizable format.

Control's Name An Example Code Snippet Output
Calender Extender <asp:ScriptManager ID="ScriptManager2" runat="server">
</
asp:ScriptManager>
<
asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
<
cc1:CalendarExtender ID="CalendarExtender1" runat="server" Enabled="True" TargetControlID="TextBox1"> </cc1:CalendarExtender>

CollapsiblePanelExtender

The CollapsiblePanelExtender server control allows you to collapse one control into another. This control enables you to hide or display the content of a panel alternatively. The CollapsiblePanelExtender control adds collapsible section to your web page. The content of your webpage will show or hide when you click the header of the collapsible section.

Link Button Collape
Control's Name An Example Code Snippet Description
Collapsible Panel Extender

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

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

<asp:Panel ID="Panel2" runat="server">

<table cellpadding="0" cellspacing="0" style="width:100%;">

 <tr>

  <td> This is collasped table.</td>

 </tr>

</table>

</asp:Panel>

<cc1:CollapsiblePanelExtender ID="Panel2_CollapsiblePanelExtender" runat="server" Enabled="True" TargetControlID="Panel2" CollapseControlID="Lable1" Collapsed="True" ExpandControlID="Lable1" SuppressPostBack="True" ScrollContents="True" ExpandedSize="100"> </cc1:CollapsiblePanelExtender>

ConfirmButtonExtender

ConfirmButtonExtender allows you to question the end user’s action and reconfirm that they want the action to occur. ConfirmButtonExtender enables you to attach a confirmation box to a button control that shows a confirm message to end user. This confirmation dialog box is the default JavaScript confirmation box but it can also associate a modal dialog box with the button control.

Control's Name An Example Code Snippet Output
Confirm Button Extender

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

<asp:Button ID="btnconfrm" runat="server" Text="Button" />

<cc1:ConfirmButtonExtender ID="ConfirmButtonExtender1" runat="server" TargetControlID="btnconfrm" DisplayModalPopupID="ModalPopupExtender1"> </cc1:ConfirmButtonExtender>

<cc1:ModalPopupExtender ID="ModalPopupExtender1" runat="server" CancelControlID="ButtonNo" OkControlID="ButtonYes" PopupControlID="Pnlcnfrm" TargetControlID="btnconfrm"> </cc1:ModalPopupExtender>

<asp:Panel ID="Pnlcnfrm" runat="server" style="display:none; background-color:White; width:200; border-width:2px; border-color:Black; border-style:solid; padding:20px;">Are you sure you wanted to click this button?

<asp:Button ID="ButtonYes" runat="server" Text="Yes" /><asp:Button ID="ButtonNo" runat="server" Text="No" /></asp:Panel>



DragPanelExtender

The DragPanelExtender enables you to drag a panel or element within the web page as you wish. This makes the panels virtually floating on the web page.

Control's Name An Example Code Snippet Output
DragPanel Extender

<asp:Panel ID="Panel2" runat="server">

<asp:Label ID="Label1" runat="server" Text="Solvingera | Drag & Drop me"></asp:Label>

</asp:Panel>

<cc1:DragPanelExtender ID="Panel2_DragPanelExtender" runat="server" DragHandleID="Panel2" Enabled="True" TargetControlID="Panel2"> </cc1:DragPanelExtender>
Solvingera | Drag & Drop me anywhere on this page

DropShadowExtender

control allows you to put a drop shadow on any control you choose as the target. You can also set the width and opacity of the drop shadow. DropShadowExtender also used for to make the round corners of controls.

Control's Name An Example Code Snippet Output
DropShadaw Extender

<asp:Button ID="Button3" runat="server" Text="Solvingera | Shadow Button" Width="180px" />

<cc1:DropShadowExtender ID="Button3_DropShadowExtender" runat="server" Enabled="True" Radius="3" TargetControlID="Button3" Width="3">

</cc1:DropShadowExtender>

FilteredTextBoxExtender

The FilteredTextBoxExtender control works for a TextBox control. It is used to filtering a textbox control to prevent certain characters from being inserted in the textbox. For example, enter only numeric value, characters etc.
The FilteredTextBoxExtender control has a property called FilterType that has the possible values of Custom, LowercaseLetters, Numbers, and UppercaseLetters.
FilterMode property contains two value i.e InvalidChars and ValidChar .

Control's Name An Example Code Snippet Output
Filtered TextBox Extender

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

Enter No. only : <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>

<cc1:FilteredTextBoxExtender ID="TextBox2_FilteredTextBoxExtender" runat="server" Enabled="True" FilterType="Numbers" TargetControlID="TextBox2"> </cc1:FilteredTextBoxExtender>

Enter Uppercase letters only : <asp:TextBox ID="TextBox3" runat="server"></asp:TextBox> <cc1:FilteredTextBoxExtender ID="TextBox3_FilteredTextBoxExtender" runat="server" Enabled="True" FilterType="UppercaseLetters" TargetControlID="TextBox3"> </cc1:FilteredTextBoxExtender>
Enter Numbers only :

 

Enter Uppercase letters only :

HoverMenuExtender

The HoverMenuExtender control enables a user to display a popup menu or hidden control when you hover over another control. You can also specify the position of popup menu or hidden control in the web page.

Control's Name An Example Code Snippet Output
Hover Menu Extender

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

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

<asp:RadioButtonList ID="RadioButtonList1" runat="server" BackColor="#CFA872" > <asp:ListItem>India</asp:ListItem>

<asp:ListItem>United States</asp:ListItem>

<asp:ListItem>United Kingdom</asp:ListItem>

<asp:ListItem>Australia</asp:ListItem>

</asp:RadioButtonList>

<cc1:HoverMenuExtender ID="HoverMenuExtender1" runat="server" HoverDelay="2" OffsetX="3" OffsetY="3" PopDelay="50" PopupControlID="RadioButtonList1" PopupPosition="Bottom" TargetControlID="Label2"> </cc1:HoverMenuExtender>

Select Your Country


MaskedEditExtender

MaskedEditExtender enables a developer to restrict a user to enter only a predefined pattern of character in the text box.

The MaskType property supplies the type of mask or filter to place on the text box. Values of MaskType are given below.
  • None–means that no validation will be performed.

  • Date–means date validation will occur.

  • DateTime–means date and time validation will occur.

  • Number–means a number validation will occur.

  • Time–means a time validation will occur
Some important symbol that is used to set tha value for mask property.
  • 9 — Only a numeric character

  • L — Only a letter

  • ? — Any character

  • $ — Only a letter or a space

  • A — Only a letter or a custom character

  • C — Only a custom character (case sensitive)

  • N — Only a numeric or custom character

  • / is a date separator

  • : is a time separator

  • . is a decimal separator

  • \ is the escape character

  • } is the final delimiter for repetition of masks

  • , is a thousand separator

  • { is the initial delimiter for repetition of masks

Control's Name An Example Code Snippet Output
Masked Edit Extender

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

Enter Date in <b>DD/MM/YYYY</b> Format: <br/>

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

<cc1:MaskedEditExtender ID="MaskedEditExtender1" runat="server" Mask="99/99/9999" MaskType="Date" TargetControlID="TextBox4"> </cc1:MaskedEditExtender>

Enter Date in DD/MM/YYYY Format:

 
 
  
     
  
DMCA.com Protection Status
Design & Maintain By solvingera group| solvingera.com © 2013-2014 | all right reserved |Privacy Policy | Back to top