Archive

Posts Tagged ‘Ajax’

Using AjaxControlToolkit Modal Popup

The Modal Popup extender comes with Ajaxcontrol toolkit and  allows a page to display content to the user in a “modal” manner which prevents the user from interacting with the rest of the page.

Demos,Documentation,Download:

http://www.asp.net/ajax/ajaxcontroltoolkit/samples/modalpopup/modalpopup.aspx

ModalPopup with Asp.net In Various Scenarios using Javascript, iframes, etc

http://www.codeproject.com/KB/ajax/ASPModalInAction.aspx

ModalPopup Examples

http://mattberseth.com/blog/2007/07/modalpopupextender_example_cre.html

Other Examples can be found at

http://mattberseth.com/blog/modalpopupextender/

Advertisements

Using Jquery, Json with Asp.net

Using Asp.net Ajax Update Progress

March 22, 2010 1 comment

Here in this article, we will learn how to use updateprogress control that comes asp.net ajax toolkit.

<asp:ScriptManager ID=”scriptManager” runat=”server” />

<asp:UpdatePanel ID=”UdpLogin” runat=”server”>
<ContentTemplate>

<div>

Content comes here…

</div>
</ContentTemplate>
</asp:UpdatePanel>

<asp:Panel ID=”UpdateProgress” runat=”server” CssClass=”ProgressContent” Width=”100%”
Height=”100%”>
<asp:UpdateProgress ID=”UpdateProg” runat=”server” DisplayAfter=”1″ AssociatedUpdatePanelID=”UdpLogin”>
<ProgressTemplate>
<asp:Panel ID=”UpdatePro” runat=”server” CssClass=”Trans” Width=”100%” Height=”100%”>
<table width=”100%” height=”100%”>
<tr>
<td align=”center” valign=”middle” width=”100%” height=”100%”>
<asp:Image ID=”imgProg” runat=”server” ImageUrl=”~/img/loading.gif” AlternateText=”Updating ……”
ImageAlign=”Middle” />
</td>
</tr>
</table>
</asp:Panel>
</ProgressTemplate>
</asp:UpdateProgress>
</asp:Panel>

Css Styles to include here are as follows:

/* StyleSheet for Update Progress */
.ProgressContent
{
font-family: verdana;
font-size: 11px;
color: #000000;
font-weight: normal;
text-decoration: none;
}

.Trans
{
background-color: White;
filter: alpha(opacity=70);
opacity: 0.7;
position: absolute;
left: 0px;
top: 0px;
}
.Progress
{
font-family: verdana;
font-size: x-small;
color: Green;
font-weight: bold;
text-decoration: none;
height: auto;
}

Please visit my previous article for downloading loading images:

https://pankajlalwani.wordpress.com/2009/05/30/download-ajax-loading-image/

Refresh Content in UpdatePanel using Asp.net Ajax Timer Control

January 19, 2010 1 comment

Lets say we have a requirement where we have a label control and we have assigned date time to its text, and in every 5 seconds we want to update the time, over there we need to place the label control inside the update panel and use a timer control to update its content.

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Update Panel and Timer</title>
</head>
<body>
    <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server" />
        <asp:Timer runat="server" id="UpdateTimer" interval="5000"
          ontick="UpdateTimer_Tick" />
        <asp:UpdatePanel runat="server" id="TimedPanel" updatemode="Conditional">
            <Triggers>
                <asp:AsyncPostBackTrigger controlid="UpdateTimer"
                  eventname="Tick" />
            </Triggers>
            <ContentTemplate>
                <asp:Label runat="server" id="lbldatetime" />
            </ContentTemplate>
        </asp:UpdatePanel>
    </form>
</body>
</html>

In the codebehind:

protected void UpdateTimer_Tick(object sender, EventArgs e)
{  
lbldatetime.Text = DateTime.Now.ToString();
}

Download Ajax Loading Image

May 30, 2009 1 comment

Since all the Ajax interactions happen behind the scenes asynchronously, the user doesn’t understand what’s going on: sometimes the user doesn’t need to know what’s going on (like when you are just reloading some data), but when he presses a button he needs to know that he did the right thing and that something is happening.

So we can show an “ajax loading image” when ajax process is going on..

You can generate these images from:

http://www.ajaxload.info/

You can also download from:

http://mentalized.net/activity-indicators/

Also you can search the google for ajax loading image and you will be able to see lots of images..

Categories: Ajax Tags: , ,

Download Cheatsheets – .Net, Sql Server, Php, Regular Expressions, CSS, Ajax,Javascript….

A cheat sheet or crib sheet is a concise set of notes used for quick reference.

You can download cheatsheets of various technologies like:

.Net

Actionscript

Ajax

Javascript

C#

HTML

Sql Server

CSS

JAVA

PHP

Regular Expressions

MySql

Asp/Vbscript

etc..

from

http://www.addedbytes.com/cheat-sheets/

http://www.cheat-sheets.org/

Data Navigation with the ListView & GridView, DataPager and SliderExtender Controls

Listview – Its a new control in asp.net 3.5, similar to gridview but much more capabilities than gridview..
Also Datapager – a new control in asp.net 3.5 used for data paging.
SliderExtender – a control of ajax toolkit

Combining all these three you can do wonders…

Below is an example of listview with datapager and slider extender

http://mattberseth.com/blog/2007/12/data_navigation_with_the_listv.html

Another example is of gridview with dataper and slider extender

http://www.dotnetcurry.com/ShowArticle.aspx?ID=219

The above links has source code to download, you can also view the live demo and play with the example..