"Enhancing user experience in ASP.NET by updating an updatepanel manually to provide feedback during the

My website includes a code-behind file and a separate class with a function that takes a significant amount of time to complete. I want to display information to the visitor when this function sends back a string.

To achieve this, I utilize a delegate to send a string back to the code-behind in the following manner:

public event Feedback feedbackInfo;
public EventArgs e = null;
public delegate void Feedback(String message, bool info);

Within my function, I implement FeedbackInfo("message", true); which is received by the setFeedback code-behind function as shown below:

public void example() {
    new Thread(delegate()
                {
                    crypto = new EncryptNoLibraries(@"C:\Users\Robbie\TestDES\New Microsoft Visio Drawing.vsdx", @"C:\Users\Robbie\TestDES\New Microsoft Visio Drawing encrypted.vsdx");
                    crypto.feedbackInfo += new EncryptNoLibraries.Feedback(setFeedback);

                    object[] allArgs = { EncryptNoLibraries.CryptType.ENCRYPT, lstSleutels };
                    object args = allArgs;
                    crypto.DoCryptFile(args);
                }).Start();
}

public void setFeedback(String message, bool info)
{
    if (info)
    {
        if (!infoCell.Visible)
        {
            errorCell.Visible = false;
            infoCell.Visible = true;
        }
        lblInfo.Text += String.Format("- {0}<br />", message);
    }
    else
    {
        if (!errorCell.Visible)
        {
            infoCell.Visible = false;
            errorCell.Visible = true;
        }
        lblError.Text += String.Format("- {0}<br />", message);
    }
}

The provided code segment showcases my webpage structure along with the use of JavaScript to update the panel through post-backs every 2.5 seconds. However, an issue arises where text in the label that should be updated gets lost upon triggering. The page's initial render differs from what is displayed after pushing the encrypt button, with not all messages appearing even after 2.5 seconds (some even disappear).

Before:

After:

What could be the possible cause for this problem?

Answer №1

It appears that the responsibility falls on me for this issue, but I have managed to devise a resolution. I decided to incorporate two static string variables to store the messages received thus far.

private static String feedbackMessages = "", failureMessages = "";
public void provideResponse(String message, bool success)
{
    if (success)
    {
        if (!feedbackCell.Visible)
        {
            failureCell.Visible = false;
            feedbackCell.Visible = true;
        }
        feedbackMessages += String.Format("- {0}<br />", message);
        lblFeedback.Text += feedbackMessages;
    }
    else
    {
        if (!failureCell.Visible)
        {
            feedbackCell.Visible = false;
            failureCell.Visible = true;
        }
        failureMessages += String.Format("- {0}<br />", message);
        lblFailure.Text += failureMessages;
    }
}

Answer №2

ASP .Net web page objects do not persist between posts; they are recreated and populated from the session store.

In my app, I implemented a global background operation using static members in a class to update users on the progress of the task.

I utilized the ASP timer to handle postbacks:

The Timer1_Tick method contained just a comment stating that PageLoad handled showing the progress.

Your situation may be more complex if you have multiple background tasks for different browser instances.

To address this, consider using a static member dictionary with session id keys to update user screens during background processing.

Cleaning up such a dictionary can present challenges when sessions come and go.

Additionally, keep in mind that IIS may shut down the entire website process after 20 minutes without any HTTP requests.

[As I was typing this detailed response, it seems you may have already found the solution yourself. Well done!]

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Retrieving properties from a URL pathname using React.js

Struggling to retrieve the uid and token from the URL pathname in my React application using the match method. However, encountered an error: Uncaught TypeError: n is undefined Here's the snippet of the code: const ResetPasswordConfirm = ( {match, ...

I am attempting to secure a webpage with a password using JavaScript

I've been working on adding password protection to my webpage at , with the goal of allowing users to enter the password once per session. However, I've encountered an issue: if a user cancels out of the initial prompt or enters the wrong passwor ...

WebWorker - Error in fetching data from server using Ajax call

I've been experimenting with making AJAX calls to an ajax.htm file using web workers. The goal is to have the data continuously updated at set intervals. Although I'm not seeing any errors and the GET request appears to be successful, the data i ...

State loss occurs when moving to a different page using next/link

Currently, I am working on a library application with Next.js. Within this project, there are two main pages: BooksPage, which displays a list of all books, and BookPage, where detailed information about a specific book is shown. The components involved in ...

How to alter row colors in SQL/PHP tables

echo "<tbody"; echo "<tr>"; echo "<td>{$id}</td>";// display customer Id echo "<td> {$firstname} {$lastname}</td>"; //display customer title,firstname,lastname echo "<td>{$date->format('h:i A')}</td> ...

We encountered a surprise issue: "/Users/username/package.json: Unexpected character \ in JSON at index 1" – this is not a duplicate question

While running the yarn command in various projects, I encountered the same error consistently. Error message: "An unexpected error occurred: "/Users/name/package.json: Unexpected token \ in JSON at position 1". Trace: SyntaxError: /Users/name/pack ...

Having trouble choosing multiple options from autocomplete drop-down with Selenium web-driver in Python

I am currently in the process of automating a webpage built with Angular that features an auto-complete dropdown with numerous elements. My goal is to click on each individual element and verify if it populates all the fields below accordingly. Below is th ...

The identifier 'gridview1' is not recognized in the current scope

I am a beginner in C#. I have been following a simple example on YouTube to connect to an SQL database. However, when using GridView1, I encountered an error. Below is the code snippet from my WebForm1.aspx.cs: using System.Linq; using System.Web; using S ...

Controlling the Escape Key and Clicking Outside the Material-ui Dialog Box

I am currently utilizing material-ui's dialog feature. In this setup, when a user clicks the "sign out" button, a dialog box opens with options to either confirm the sign out by selecting "yes" or cancel it by choosing "no". The issue arises when the ...

What is the best way to include React globally when running unit tests?

In my Rails project, I have integrated the react-rails gem, which sets up a global variable like this: window.React = React; While this is convenient for regular usage, it causes issues when running unit tests with Jest because the global React variable ...

Creating a unique navigation route in React

My application has a consistent layout for all routes except one, which will be completely different from the rest. The entire application will include a menu, body, footer, etc. However, the one-off route should be standalone without these elements. How ...

Test your knowledge of Javascript with this innerHtml quiz and see

How can I display the output of a score from a three button radio button quiz without using an alert popup? I want the output to be displayed within a modal for a cleaner look. I tried using InnerHTML but now there is no output when the button is clicked. ...

Merge two ASP.NET websites into a single entity

I am a beginner in asp.net and I'm unsure of how to merge two asp.net websites into one, like the concept of a domain and subdomain. I understand the process of hosting a single web application in local IIS. Can you please explain how to combine two a ...

Searching for the perfect jQuery regex to validate date formats

In my application, there is an input box that allows users to enter a string date like "today" or "tomorrow". However, I am facing a new challenge now - dates such as "3 march" or "8 january." The input box includes a dropdown menu feature where users can ...

What is the best way to omit the final item in a v-for loop?

I'm just starting out with JavaScript and learning about JS frameworks. I recently came across this snippet of Vuejs code: <div v-for="coefficient in coefficients" class="coefficient"> <div> <span class="name">name:{{coe ...

Update the CSS styles using properties specified within an object

Is it possible to dynamically apply CSS styles stored in a JavaScript object to elements? For instance, can we change the width and background of a basic <div> element: <div id="box"></div> <button id="btn">click me</button> ...

Issue with JQuery addClass functionality in Firefox

I've come across numerous posts on this topic, but none of them have provided a solution. I recently added drag and drop functionality to my website. When I drag an item over a valid container, I add a specific class to it. Here is the HTML for the ...

Is randomly pairing 2 datapairs after slicing a JSON array easy or challenging?

There is a JSON file containing an unlimited number of users [{ "fname": "Hubert", "lname": "Maier", "email": "<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="bd ...

Adding a class to radio buttons and checkboxes in Angular when they are checked or selected without needing to trigger a change event

I am looking to implement ngClass based on whether an item is checked or not. Essentially, I want the user to visually see which items are selected through radio buttons or check-boxes by adding a class to them, allowing me to apply different CSS styles to ...

Using Javascript to make a call to a RESTful endpoint

My current challenge involves attempting to make a call to the Spotify API from JavaScript: function callAPI() { var xhttp = new XMLHttpRequest(); xhttp.open('GET', 'https://api.spotify.com/v1/search?q=Muse&type=track'); ...