About the author

Vijay Kodali
E-mail me Send mail

Recent comments

Authors

Disclaimer

The opinions expressed herein are my own personal opinions and do not represent my employer's view in anyway.

© Copyright 2024

AsyncFileUpload events with Update Panel

Problem:

 

Last week I came across this bug (?) with AsyncFileUpload control in updatepanel. The control is not firing OnUploadedComplete server side event when it’s in updatepanel.

 

Solution:

 

After doing some research on this issue, came across these solutions.

 

1)     Add another AsyncFileUpload control on the page and set its’ style to display:none; 

 

       

<div style="display: none;">

  <cc1:AsyncFileUpload ID="AsyncFileUpload1" runat="server" />

</div>

 

 

2)     Another workaround is to add the following attributes to the <form> tag of the page..

enctype="multipart/form-data" method="post"

 

 

Both the solutions are working fine.

 

 

Thanks to obout_teo and MikeMelendez of Asp.Net forums


Categories: AJAX | ASP.Net 3.5
Posted by Vijay on Monday, September 20, 2010 6:22 PM
Permalink | Comments (5) | Post RSSRSS comment feed

Asp.net session on browser close

How to capture logoff time when user closes browser?

Or

How to end user session when browser closed?

These are some of the frequently asked questions in asp.net forums.

In this post I'll show you how to do this when you're building an ASP.NET web application.

Before we start, one fact:

There is no full-proof technique to catch the browser close event for 100% of time. The trouble lies in the stateless nature of HTTP. The Web server is out of the picture as soon as it finishes sending the page content to the client. After that, all you can rely on is a client side script. Unfortunately, there is no reliable client side event for browser close.

Solution:

The first thing you need to do is create the web service. I've added web service and named it AsynchronousSave.asmx. 

 Open Dialog

Make this web service accessible from Script, by setting class qualified with the ScriptServiceAttribute attribute... 

clip_image004

Add a method (SaveLogOffTime) marked with [WebMethod] attribute. This method simply accepts UserId as a string variable and writes that value and logoff time to text file. But you can pass as many variables as required. You can then use this information for many purposes.

clip_image006

To end user session, you can just call Session.Abandon() in the above web method.

To enable web service to be called from page’s client side code, add script manager to page. Here i am adding to SessionTest.aspx page

clip_image008

When the user closes the browser, onbeforeunload event fires on the client side. Our final step is adding a java script function to that event, which makes web service calls. The code is simple but effective

clip_image010

My Code

HTML:( SessionTest.aspx )

clip_image012

C#:( SessionTest.aspx.cs )

clip_image014

That’s’ it. Run the application and after browser close, open the text file to see the log off time.

clip_image016

The above code works well in IE 7/8. If you have any questions, leave a comment.


Posted by vijay on Thursday, April 29, 2010 6:09 PM
Permalink | Comments (22) | Post RSSRSS comment feed

ASP.Net AJAX AsyncFileUpload Control

AsyncFileUpload is a new ASP.NET AJAX Control (Ajax Control Toolkit (v 3.0.30930) released for .NET 3.5 SP1) that allows you asynchronously upload files to server. You don’t need a separate upload button for this control.  Add the AsyncFileUpload control and a label to the web form for the uploading and displaying messages respectively.  HTML:

<asp:ScriptManager ID="ScriptManager1" runat="server"> 
</asp:ScriptManager> 
<cc1:AsyncFileUpload ID="AsyncFileUpload1" runat="server" CompleteBackColor="White" 
OnUploadedComplete="AsyncFileUpload1_UploadedComplete" OnUploadedFileError="AsyncFileUpload1_UploadedFileError" 
OnClientUploadComplete="Success" OnClientUploadError="Error" /> 
<asp:Label ID="Label1" runat="server"></asp:Label> 

Server side events:

protected void AsyncFileUpload1_UploadedComplete(object sender, AjaxControlToolkit.AsyncFileUploadEventArgs e) 
{ 
 //Fired on the server side when the file successfully uploaded 
   if (AsyncFileUpload1.HasFile) 
   { 
         AsyncFileUpload1.SaveAs(@"C:\Images\" + AsyncFileUpload1.FileName ); 
         Label1.Text = "Received " + AsyncFileUpload1.FileName + " Content Type " + AsyncFileUpload1.PostedFile.ContentType ; 
   } 
 } 
protected void AsyncFileUpload1_UploadedFileError(object sender, AjaxControlToolkit.AsyncFileUploadEventArgs e) 
 { 
 //Fired on the server side when the loaded file is corrupted 
 //Display some error message here 
 } 

Client side events:

OnClientUploadError - The name of a javascript function executed in the client-side if the file uploading failed  

OnClientUploadComplete - The name of a javascript function executed in the client-side on the file uploading completed

function Success() { 
document.getElementById("Label1").innerHTML = "File Uploaded Successfully !!"; 
} 
function Error() { 
document.getElementById("Label1").innerHTML = "File upload failed"; 
} 

We can use  OnClientUploadComplete to clear fileupload control selction,

function Success() { 
document.getElementById ("Label1").innerHTML = "File Uploaded Successfully !!"; 
var fu = document.getElementById("AsyncFileUpload1"); 
document.getElementById("AsyncFileUpload1").innerHTML = fu.innerHTML; 
} 

Reference:  http://www.asp.net/AJAX/AjaxControlToolkit/Samples/AsyncFileUpload/AsyncFileUpload.aspx


Posted by vijay on Friday, October 2, 2009 2:48 PM
Permalink | Comments (0) | Post RSSRSS comment feed

TabContainer cannot have children of type error with Ajax tab control

Error:

 

You will get following error, if you try to add a sever control to AjaxTollkit’s tab panel.

 

TabContainer cannot have children of type 'System.Web.UI.WebControls.DataList'.

 

 

That’s because tab panel must be a server control, it should have an ID and runat =”server” attribute.

 

Solution:

 

Add an ID and runat =”server” attribute to that TabPanel, like this..

 

    <cc1:TabContainer ID="TabContainer1" runat="server">

        <cc1:TabPanel ID="TabPanel1" runat="server">

            <ContentTemplate>

                <asp:DataList ID="DataList1" runat="server">

                </asp:DataList>

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

                </asp:Label>

            </ContentTemplate>

        </cc1:TabPanel>

    </cc1:TabContainer>

 


Categories: AJAX | ASP.Net 3.5
Posted by Vijay on Wednesday, January 14, 2009 1:00 PM
Permalink | Comments (1) | Post RSSRSS comment feed

Dynamic Accordion control same ID _header error

Multiple controls with the same ID '_header' were found. FindControl requires that controls have unique IDs.

 I got this error, when I tried adding multiple accordion panes to the accordion control in code behind. The problem is with duplicate ID for the panes. Setting unique ID's to dynamic panes will fix the problem.

<cc1:accordion id="Accordion1" runat="Server" selectedindex="0" 
  headercssclass="accordionHeader" contentcssclass="accordionContent" 
  autosize="None" fadetransitions="true" transitionduration="250"
  framespersecond="40" requireopenedpane="false" suppressheaderpostbacks="true">
</cc1:accordion>

In Code behind:

for (int i = 0; i < 3; i++)
{
    AccordionPane pane1 = new AccordionPane();
    //Here i used Guid for uniqueness
    pane1.ID = "AccordionPane" + Guid.NewGuid().ToString();
    Label lbl = new Label();
    lbl.Text = "New pane";
    pane1.Controls.Add(lbl);
    Accordion1.Panes.Add(pane1);
}


Categories: AJAX | Web Development
Posted by vijay on Monday, January 12, 2009 12:39 PM
Permalink | Comments (0) | Post RSSRSS comment feed

jQuery now officially part of the .NET toolbox

Microsoft is going to make jQuery part of the official dev platform. JQuery will come with Visual Studio in the long term, and in the short term it'll ship with ASP.Net MVC. It is truly good news for ASP.Net developers

What is jQuery?

jQuery is a lightweight open source JavaScript library.

From jQuery website..

jQuery is a fast and concise JavaScript Library that simplifies HTML document traversing, event handling, animating, and Ajax interactions for rapid web development.

Blogs posts by Scott Guthrie and Scott Hanselman on this topic.


Posted by vijay on Tuesday, September 30, 2008 7:11 PM
Permalink | Comments (0) | Post RSSRSS comment feed

to call server side function from Javascript function?

Some times we need to call server side function from Javascript function.For example,callig a PoupWindow(with value from code behind) on HyperLink click. 

This must be implemented by creating a additional request to the web server and that’s the only way to invoke methods on the server. Page methods are used for this.

What is PageMethod?

A PageMethod is a public static method that is exposed in the code-behind of a page and can be called from the client script. PageMethods are annotated with [System.Web.Services.WebMethod] attribute.

The code is simple..

Server side function

[code:c#]

[System.Web.Services.WebMethod] public static void Score(string ID, string name, string Role) {
         try {
                //Some data manipulations 
                  return finalScore ; 
              }
         catch (Exception ex) { 
               //Response.Write(ex.ToString());
                                  } 
            } 

[/code]

//Client Side function 

[code:c#]

function score()
              {               
                  PageMethods.Score(txtID.value,txtName.value,txtRole.value);            
               } 

[/code]

<asp:HyperLink ID="btn_Test" runat="server" Text="Calculate" OnClientClick="javascript:return score();"/> 

Tags:
Categories: AJAX | ASP.NET | C#
Posted by vijay on Friday, August 24, 2007 12:23 PM
Permalink | Comments (0) | Post RSSRSS comment feed

ListSearchExtender AJAX control

The ListSearchExtender lets you search for items in a ListBox or DropDownList by typing.  The extender performs an incremental search within the ListBox based on what has been typed so far.

the code is simple 

 <ajaxToolkit:ToolkitScriptManager ID="ScriptManager1" EnablePartialRendering="true" EnableScriptGlobalization="true" EnableScriptLocalization="true" runat="Server" />

ScriptManger is required for all AJAX controls..

 <ajaxToolkit:ListSearchExtender ID="ListSearchExtender1" runat="server" TargetControlID="ListBox1" PromptCssClass="ListSearchExtenderPrompt" PromptPosition="Top"></ajaxToolkit:ListSearchExtender/>

  • PromptText - Message to display when the ListBox is given focus. 
  • TargetControlID - Control to be searched
  • PromptPosition - Indicates whether the message should appear at the Top or Bottom of the ListBox.  The default is Top.

Categories: AJAX | ASP.NET
Posted by vijay on Saturday, August 18, 2007 6:09 PM
Permalink | Comments (2) | Post RSSRSS comment feed