ASP.NET

Show "please wait.." unless untill ListView bind data completely RSS

9 replies

Last post Aug 19, 2010 02:05 AM by Decker Dong - MSFT

‹ Previous Thread|Next Thread ›

- Reply
shekhar1983

Member

3 Points

34 Posts

Show "please wait.." unless untill ListView bind data completely

Aug 18, 2010 08:21 AM|LINK

Hi All I am trying to show "Please wait..." message when i am trying to bind data to listview. I tried but its nottttanybody gives some idea.

Is there any Listview event where i can create a label and show my message.

Thx

Shekhar
- Moved by Mikesdotnetting on Aug 18, 2010 09:36 AM

suthish nair

All-Star

15176 Points

3304 Posts

Re: Show "please wait.." unless untill ListView bind data completely

Aug 18, 2010 10:42 AM|LINK

if you are using UpdatePanel then..

<asp:UpdateProgress ID="uupp1" runat="server" DynamicLayout="false">
   <ProgressTemplate><b>Loading...</b><br /><img src="images/9.gif" alt="Loading" /></ProgressTemplate>
</asp:UpdateProgress>


<asp:UpdatePanel ID="up1" runat="server" UpdateMode="Conditional">
 <ContentTemplate>
    Listview comes here
 </ContentTemplate>
</asp:UpdatePanel>

Mark as Answer, on the posts replys that helped you !!!.

My Blog

- Reply
shekhar1983

Member

3 Points

34 Posts

Re: Show "please wait.." unless untill ListView bind data completely

Aug 18, 2010 11:43 AM|LINK

Thanx for your reply but still i am not able to see loading image when databind happen in listview.

Can u please give some more idea.... I have tried some diff way but i was't able to do.

Shekhar
- Reply
suthish nair

All-Star

15176 Points

3304 Posts

Re: Show "please wait.." unless untill ListView bind data completely

Aug 18, 2010 11:51 AM|LINK

show me your source code...

Mark as Answer, on the posts replys that helped you !!!.

My Blog
- Reply
shekhar1983

Member

3 Points

34 Posts

Re: Show "please wait.." unless untill ListView bind data completely

Aug 18, 2010 12:21 PM|LINK

<asp:UpdateProgress ID="Up1" runat="Server" DynamicLayout="false" AssociatedUpdatePanelID="UpdatePanel2">

<ProgressTemplate>

<b>Loading...</b><br /><img src="/images/indicator-big.gif" alt="Please wait" />

</ProgressTemplate>

</asp:UpdateProgress>

<asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode ="Conditional" >

<ContentTemplate>

<asp:ListView ID="lvSearch" runat="server" OnItemDataBound="lvSearch_ItemDataBound"

OnSorting="lvSearch_Sorting" DataSourceID="odsSearch"

Visible="false">

//////

some code listview data bind

////

</ContentTemplate>

<Triggers>

<asp:AsyncPostBackTrigger ControlID="btnGo" />

</Triggers>

</asp:UpdatePanel>

suthish nair

All-Star

15176 Points

3304 Posts

Re: Show "please wait.." unless untill ListView bind data completely

Aug 18, 2010 12:34 PM|LINK

Another way..

<script type="text/javascript">
	function pageLoad(sender, args) {
		var sm = Sys.WebForms.PageRequestManager.getInstance();
		if (!sm.get_isInAsyncPostBack()) {
			sm.add_beginRequest(onBeginRequest);
			sm.add_endRequest(onRequestDone);
		}
	}
	function onBeginRequest(sender, args) {
	  var send = args.get_postBackElement().id;
		if (WaitMe(send) == "yes") {
			$find('Popup').show();
		}
	}
	function onRequestDone() {
	  $find('Popup').hide();
	}
	function WaitMe(send) {
		switch (send) {
			case '<%=btnGo.ClientID%>':
				return ("yes");
				break;
			default:
				return ("no");
				break;
		}
	}
</script>




<asp:Button ID="HiddenButton" runat="server" Text="Hidden Button" Style="display: none;" />
<cc1:ModalPopupExtender ID="Popup" runat="server" TargetControlID="HiddenButton" BehaviorID="PWPopup"  PopupControlID="pnlPopup" BackgroundCssClass="yourcss"  />
<asp:Panel ID="pnlPopup" runat="server" CssClass="updateProgress">
<div align="center" style="margin-top:13px;">
	<b style="color: Navy">Processing ...</b><br /><img src="images/Wait.gif" alt="" /><br />
</div>
</asp:Panel>


<asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode ="Conditional" >
	<ContentTemplate>
		<asp:ListView ID="lvSearch" runat="server" OnItemDataBound="lvSearch_ItemDataBound" OnSorting="lvSearch_Sorting" DataSourceID="odsSearch" Visible="false">
	</ContentTemplate>
	<Triggers>
		<asp:AsyncPostBackTrigger ControlID="btnGo" />
	</Triggers>
</asp:UpdatePanel>

Mark as Answer, on the posts replys that helped you !!!.

My Blog

shekhar1983

Member

3 Points

34 Posts

Re: Show "please wait.." unless untill ListView bind data completely

Aug 18, 2010 01:45 PM|LINK

function pageLoad(sender, args) {
        var sm = Sys.WebForms.PageRequestManager.getInstance();
        if (!sm.get_isInAsyncPostBack()) {
            sm.add_beginRequest(onBeginRequest);
            sm.add_endRequest(onRequestDone);
        }
    }
    function onBeginRequest(sender, args) {
        var send = args.get_postBackElement().id;
        if (WaitMe(send) == "yes") {
            $find('Popup').show();
        }
    }
    function onRequestDone() {
        $find('Popup').hide();
    }
    function WaitMe(send) {
        switch (send) {
            case '<%=btnGo.ClientID%>':
                return ("yes");
                break;
            default:
                return ("no");
                break;
        }
    }

when i try to run this code(Bold) throughs error "Microsoft JScript runtime error: 'null' is null or not an object"

- Reply
suthish nair

All-Star

15176 Points

3304 Posts

Re: Show "please wait.." unless untill ListView bind data completely

Aug 18, 2010 05:40 PM|LINK

provide your full source

Mark as Answer, on the posts replys that helped you !!!.

My Blog
- Reply
suthish nair

All-Star

15176 Points

3304 Posts

Re: Show "please wait.." unless untill ListView bind data completely

Aug 18, 2010 05:45 PM|LINK

refer, example: http://mattberseth.com/blog/2007/07/modalpopup_as_an_ajax_progress.html

Mark as Answer, on the posts replys that helped you !!!.

My Blog
- Reply
Decker Dong ...

All-Star

118619 Points

18779 Posts

Re: Show "please wait.." unless untill ListView bind data completely

Aug 19, 2010 02:05 AM|LINK

You can also look at this:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<%@ Register Assembly="System.Web.Entity, Version=3.5.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089"

    Namespace="System.Web.UI.WebControls" TagPrefix="asp" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

    <title>Update Progress Sample</title>

    <script type="text/javascript">

        function onUpdating() {

            var updateProgressDiv = document.getElementById('upCustomer');

            var gridView = document.getElementById('gvUpdateProgress');

            var gridViewBounds = Sys.UI.DomElement.getBounds(gridView);

            var updateProgressDivBounds = Sys.UI.DomElement.getBounds(updateProgressDiv);

            var x = gridViewBounds.x + Math.round(gridViewBounds.width / 2) - Math.round(updateProgressDivBounds.width / 2);

            var y = gridViewBounds.y + Math.round(gridViewBounds.height / 2) - Math.round(updateProgressDivBounds.height / 2);

            Sys.UI.DomElement.setLocation(updateProgressDiv, x, y);

        }

    </script>

</head>

<body>

    <form id="frmUpdateProgress" runat="server">

    <div>

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

        </asp:ScriptManager>

        <table border="0" cellpadding="0" cellspacing="0" width="100%">

            <tbody>

                <tr>

                    <td align="center" style="font-family: Calibri; background-color: #3366CC; color: #FFFFFF;

                        visibility: hidden; width: 100%">

                        UpdateProgress Sample

                    </td>

                </tr>

                <tr>

                    <td style="border: medium dotted Navy; font-family: Calibri; color: Purple; width: 100%;

                        border-color: Red; border-top-width: thick;">

                        <asp:UpdateProgress ID="upCustomer" AssociatedUpdatePanelID="upnlCustomer" runat="server">

                            <ProgressTemplate>

                                <div id="imgdivLoading" align="center" valign="middle" runat="server" style="border-style: dotted;

                                    padding: inherit; margin: auto; position: absolute; visibility: visible; vertical-align: middle;

                                    border-color: #000066 black black black; border-width: medium">

                                    <asp:Image ID="imgLoading" runat="server" ImageUrl="Images/loading.gif" Width="34px" />Loading...

                                </div>

                            </ProgressTemplate>

                        </asp:UpdateProgress>

                    </td>

                </tr>

                <tr>

                    <td>

                    </td>

                </tr>

                <tr>

                    <td>

                         

                    </td>

                </tr>

                <tr>

                    <td style="width: 100%">

                        <asp:UpdatePanel ID="upnlCustomer" runat="server">

                            <ContentTemplate>

                                <asp:GridView ID="gvUpdateProgress" runat="server" AutoGenerateColumns="False" DataKeyNames="CustomerID"

                                    AllowPaging="True" CellPadding="4" ForeColor="#333333" GridLines="None" Font-Names="Calibri"

                                    OnPageIndexChanging="gvUpdateProgress_PageIndexChanging" Width="100%" Caption="UpdateProgress Sample">

                                    <RowStyle BackColor="#EFF3FB" />

                                    <Columns>

                                        <asp:BoundField DataField="CustomerID" HeaderText="CustomerID" ReadOnly="True" SortExpression="CustomerID" />

                                        <asp:BoundField DataField="CompanyName" HeaderText="CompanyName" SortExpression="CompanyName" />

                                        <asp:BoundField DataField="ContactName" HeaderText="ContactName" SortExpression="ContactName" />

                                        <asp:BoundField DataField="City" HeaderText="City" SortExpression="City" />

                                        <asp:BoundField DataField="PostalCode" HeaderText="PostalCode" SortExpression="PostalCode" />

                                        <asp:BoundField DataField="Country" HeaderText="Country" SortExpression="Country" />

                                        <asp:BoundField DataField="Phone" HeaderText="Phone" SortExpression="Phone" />

                                    </Columns>

                                    <FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />

                                    <PagerStyle BackColor="#2461BF" BorderStyle="None" ForeColor="White" HorizontalAlign="Right"

                                        Height="15px" />

                                    <SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True" ForeColor="#333333" />

                                    <HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />

                                    <EditRowStyle BackColor="#2461BF" />

                                    <AlternatingRowStyle BackColor="White" />

                                </asp:GridView>

                            </ContentTemplate>

                        </asp:UpdatePanel>

                    </td>

                </tr>

            </tbody>

        </table>

    </div>

    </form>

</body>

</html>

C# code

using System;

using System.Collections.Generic;

using System.Linq;

using System.Data;

using System.Data.SqlClient;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

public partial class _Default : System.Web.UI.Page

{

    protected void Page_Load(object sender, EventArgs e)

    {

        gvUpdateProgress.Attributes.Add("onclick", " onUpdating();"); // adding java script to grid view.

        bindGrid();

    }


/// <summary>
/// Getting Customer table data from North wind database to bind gridview
/// </summary>
private void bindGrid()
{
SqlConnection conn = new SqlConnection("Trusted_Connection=yes;Addr=Localhost;Initial Catalog=Northwind");
SqlCommand cmdCustomer = new SqlCommand("SELECT [CustomerID],[CompanyName],[ContactName],[City],[PostalCode],[Country],[Phone] FROM Customers", conn);
SqlDataAdapter adptCustomer = new SqlDataAdapter(cmdCustomer);
DataSet dsCustomer = new DataSet();
adptCustomer.Fill(dsCustomer,"Customer");
gvUpdateProgress.DataSource = dsCustomer.Tables["Customer"].DefaultView;
gvUpdateProgress.DataBind();
}

/// <summary>

///

/// </summary>

/// <param></param>

/// <param></param>



    protected void gvUpdateProgress_PageIndexChanging(object sender, GridViewPageEventArgs e)

    {

        System.Threading.Thread.Sleep(3000); // Loading image waiting period

        gvUpdateProgress.PageIndex = e.NewPageIndex;

        gvUpdateProgress.DataBind();

    }

}

PS: You can download the needed database here : http://code.msdn.microsoft.com/northwind/Release/ProjectReleases.aspx?ReleaseId=1401
- Marked as answer by decker dong - msft on Aug 25, 2010 12:58 AM

‹ Previous Thread|Next Thread ›

Show "please wait.." unless untill ListView bind data completely RSS

9 replies

shekhar1983

Show "please wait.." unless untill ListView bind data completely

suthish nair

Re: Show "please wait.." unless untill ListView bind data completely

shekhar1983

Re: Show "please wait.." unless untill ListView bind data completely

suthish nair

Re: Show "please wait.." unless untill ListView bind data completely

shekhar1983

Re: Show "please wait.." unless untill ListView bind data completely

suthish nair

Re: Show "please wait.." unless untill ListView bind data completely

shekhar1983

Re: Show "please wait.." unless untill ListView bind data completely

suthish nair

Re: Show "please wait.." unless untill ListView bind data completely

suthish nair

Re: Show "please wait.." unless untill ListView bind data completely

Decker Dong ...

Re: Show "please wait.." unless untill ListView bind data completely

This site is managed for Microsoft by Neudesic, LLC. | © 2013 Microsoft. All rights reserved.

Follow Us On:

Microsoft