Link to home
Create AccountLog in
Avatar of dotnet0824
dotnet0824

asked on

simple ajax user control which updates timely

Hi,

I created a v simple user control using ajax updatepanel.
and called it in a asp.net page. it works fine but looks like usercontrol doesnot refresh. I added new records to check
but i am not sure whats wrong I am doing.


UserControl Design Code

<div style="padding-top: 0px">
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate>
                &nbsp;<asp:Label id="ltlctrl"  Width="30%" Height="18px"  runat="server"></asp:Label>
                <asp:Timer ID="Timer1" runat="server" Interval="10" OnTick="Timer1_Tick1">
                </asp:Timer>
                <fieldset>
                    &nbsp;</fieldset>
            </ContentTemplate>
        </asp:UpdatePanel>
    &nbsp;
        <br />
        </div>


============================Code behind in userControl==================
private void Page_Load(object sender, System.EventArgs e)

      {
          GetNews();
       
    }



    public void GetNews()
    {
        // Put user code to initialize the page here

        SqlConnection myCon = new SqlConnection("server=TEST;DATABASE=SA_USER;USER ID=sa;password=;");

        string strSql = "SELECT top 5 *  FROM tbl_News order by dateCreated asc";

        string strScrolling = "";

        HtmlTableCell cellScrolling = new HtmlTableCell();

        SqlCommand myComd = new SqlCommand(strSql, myCon);

        SqlDataReader sqlRdr;

        try
        {

            myCon.Open();

            sqlRdr = myComd.ExecuteReader();

            strScrolling = "<Marquee OnMouseOver='this.stop();' OnMouseOut='this.start();' direction='up'   scrollamount='2' bgcolor='blue' width='80%'>";

            while (sqlRdr.Read())
            {

                strScrolling = strScrolling + "<a href='#' OnClick=" + "javascript:window.open('newsDetail.aspx?NewsId=" + sqlRdr.GetValue(0) + "','NewsDetail','width=400,height=400;toolbar=no;');" + "><font  face='verdana' size='2' color='#ffffff'>" + sqlRdr.GetValue(1) + "</a>&nbsp;&nbsp;" + sqlRdr.GetValue(2).ToString() + "</font><br><br>";
            }

            strScrolling = strScrolling + "</Marquee>";

            sqlRdr.Close();
            ltlctrl.Text = strScrolling;

            //cellScrolling.InnerHtml = strScrolling;

            //rowScrolling.Cells.Add(cellScrolling);  

        }

        catch (Exception ex)
        {

            throw (ex);

        }

        finally
        {

            //close sql connection    

            myCon.Close();

        }

    protected void Timer1_Tick1(object sender, EventArgs e)
    {
        UpdatePanel1.Update();
    }
    }
===========================ASP.NET Page added that user Control--------------------
<%@ Register TagPrefix="uc1" TagName="links" Src="Ticker.ascx" %>
<!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>Untitled Page</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <uc1:links ID="link1" runat="server" />
    </div>
    </form>
</body>
</html>
SOLUTION
Avatar of baijajusav
baijajusav

Link to home
membership
Create a free account to see this answer
Signing up is free and takes 30 seconds. No credit card required.
See answer
Avatar of dotnet0824
dotnet0824

ASKER

i did what u said but no luck..

<div style="padding-top: 0px">
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
         
             <Triggers>
            <asp:AsyncPostBackTrigger ControlID="Timer1" EventName="Tick">
            </asp:AsyncPostBackTrigger>
           </Triggers>
   <ContentTemplate>
                &nbsp;<asp:Label id="ltlctrl"  Width="30%" Height="18px"  runat="server"></asp:Label>
                <asp:Timer ID="Timer1" runat="server" Interval="10" >
                </asp:Timer>
                <fieldset>
                    &nbsp;</fieldset>
       </ContentTemplate>
        </asp:UpdatePanel>
    &nbsp;
        <br />
        </div>
   
i would suggest using iframe and adding refresh metatag in header. overriding createchildcontrols routine
protected override void CreateChildControls()
{
   getNews();
}

if your design do not allow this.I may still be able to help you. But i need to take a look at both code behind and aspx page. Please send me your code as attachment.
Hi, Please find it attatched. you can add those to ur website. Pretty much the same I posted above. Thanks in advance
its not allowing .cs extensions while attatching I am pasting code here once again the same one pasted above

Ticker.ascx
------------------
<%@ Control Language="C#" AutoEventWireup="true" CodeFile="Ticker.ascx.cs" Inherits="Ticker" %>
<%@ Register Assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"
    Namespace="System.Web.UI" TagPrefix="asp" %>

<div style="padding-top: 0px">
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
         
             <Triggers>
            <asp:AsyncPostBackTrigger ControlID="Timer1" EventName="Tick">
            </asp:AsyncPostBackTrigger>
           </Triggers>
   <ContentTemplate>
                &nbsp;<asp:Label id="ltlctrl"  Width="30%" Height="18px"  runat="server"></asp:Label>
                <asp:Timer ID="Timer1" runat="server" Interval="10" >
                </asp:Timer>
                <fieldset>
                    &nbsp;</fieldset>
       </ContentTemplate>
        </asp:UpdatePanel>
    &nbsp;
        <br />
        </div>
---------------ticket.ascx.cs-------------------
using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using System.Data.SqlClient;

public partial class Ticker : System.Web.UI.UserControl
{
     private void Page_Load(object sender, System.EventArgs e)

      {
          GetNews();
       
    }



    public void GetNews()
    {
        // Put user code to initialize the page here

        SqlConnection myCon = new SqlConnection("server=local;DATABASE=news;USER ID=sa;password=sa;");

        string strSql = "SELECT * FROM tbl_News order by dateCreated asc";

        string strScrolling = "";

        HtmlTableCell cellScrolling = new HtmlTableCell();

        SqlCommand myComd = new SqlCommand(strSql, myCon);

        SqlDataReader sqlRdr;

        try
        {

            myCon.Open();

            sqlRdr = myComd.ExecuteReader();

            strScrolling = "<Marquee OnMouseOver='this.stop();' OnMouseOut='this.start();' direction='up'   scrollamount='2' bgcolor='blue' width='80%'>";

            while (sqlRdr.Read())
            {

                strScrolling = strScrolling + "<a href='#' OnClick=" + "javascript:window.open('newsDetail.aspx?NewsId=" + sqlRdr.GetValue(0) + "','NewsDetail','width=400,height=400;toolbar=no;');" + "><font  face='verdana' size='2' color='#ffffff'>" + sqlRdr.GetValue(1) + "</a>&nbsp;&nbsp;" + sqlRdr.GetValue(2).ToString() + "</font><br><br>";
            }

            strScrolling = strScrolling + "</Marquee>";

            sqlRdr.Close();
            ltlctrl.Text = strScrolling;

            //cellScrolling.InnerHtml = strScrolling;

            //rowScrolling.Cells.Add(cellScrolling);  

        }

        catch (Exception ex)
        {

            throw (ex);

        }

        finally
        {

            //close sql connection    

            myCon.Close();

        }
    }



    protected void Timer1_Tick1(object sender, EventArgs e)
    {
        UpdatePanel1.Update();
    }
}

-----------------------------------------Calling ie Referring UserControl created in ASP.NET default page
<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %>
<%@ Register TagPrefix="uc1" TagName="links" Src="Ticker.ascx" %>
<!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>Untitled Page</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <uc1:links ID="link1" runat="server" />
    </div>
    </form>
</body>
</html>
   


      
 

 

I think this might boil down to a page life cycle issue. Instead of calling GetNews() in the Page_Load event try putting the call in one of the following events: PreLoad, PreRender. I've only got the xpress editions of vs 2008 so I can't make a user control to test this.

Here some more life cycle info:

http://john-sheehan.com/blog/wp-content/uploads/aspnet-life-cycles-events.pdf

Okay some more info...Try the OnLoad event before those other two I mentioned. It's what Microsoft suggests if you're making a database connection or what not.

See: http://msdn.microsoft.com/en-us/library/ms178472.aspx
does some one try this on VS.NET 2005 . though its pretty simple it does not seem to refresh.
Silly question: have you tried running this code outside of a control and just in its on web application to ensure all the logic works like you think it should?
I am attaching demo project for your reference. Hope this help you mould it according to your needs.
 

Default HTML View
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
 
<%@ Register Src="marqueeControl.ascx" TagName="marqueeControl" TagPrefix="uc1" %>
 
<!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>Untitled Page</title>
</head>
<body>
    <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server" />
        <div>
            <uc1:marqueeControl ID="MarqueeControl1" runat="server" />
        </div>
    </form>
</body>
</html>
 
Control HTML View
<%@ Control Language="C#" AutoEventWireup="true" CodeFile="marqueeControl.ascx.cs"
    Inherits="marqueeControl" %>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
    <ContentTemplate>
        <marquee><asp:Label id="lblMessage" runat="server" __designer:wfdid="w3" Text="variable"></asp:Label></marquee>
        <asp:Timer ID="Timer1" runat="server" Interval="6000" OnTick="Timer1_Tick">
        </asp:Timer>
    </ContentTemplate>
</asp:UpdatePanel>
 
Control Codebehind
using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
 
public partial class marqueeControl : System.Web.UI.UserControl
{
    protected void Page_Load(object sender, EventArgs e)
    {
 
    }
    protected void Timer1_Tick(object sender, EventArgs e)
    {
        
        UpdatePanel1.Update();
    }
 
    protected override void CreateChildControls()
    {
        base.CreateChildControls();
        lblMessage.Text = DateTime.Now.ToString();
    }
}

Open in new window

ASKER CERTIFIED SOLUTION
Link to home
membership
Create a free account to see this answer
Signing up is free and takes 30 seconds. No credit card required.
thanks guys. it works finally.. just created a asp.net ajax enabled webpage and made it a user control and called itover in asp.net page. it works fine now.