What is the best way to save the current time in a database using JavaScript in an ASP.NET application?

I positioned the Label outside the update panel so that any error or confirmation messages would be displayed on the top right side without reloading the entire page. However, the label is not displaying any text. When I comment out the update panel, it works but it causes the whole page to reload, which is not what I want. Can someone help me with this issue?

Below is the Page Design Code where the label is set:

<div>
  <asp:Label ID ="se" CssClass="mess" runat="server" ClientIDMode="Static" > 
  </asp:Label>
</div>

<div>
  <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
  <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">

  <Triggers>
    <asp:AsyncPostBackTrigger EventName="Click" ControlID="b1" />
  </Triggers>
    <ContentTemplate>
      <div>
        <asp:Button ID="b1" runat="server"  Text="Submit."  />
      </div>
    </ContentTemplate>
  </asp:UpdatePanel>
</div>

CSS used for the Label:

.mess{
    z-index:3;
   -o-box-shadow:1px 1px 1px 1px #322e2e;
   -moz-box-shadow:1px 1px 1px 1px #322e2e;
   -webkit-box-shadow:1px 1px 1px 1px #322e2e;
    box-shadow:1px 1px 1px 1px #322e2e;
    float:right;
    padding:10px;
    border-radius:25px 25px 25px 0;
    background-color:#5db620;
    color:#f1eded;
    margin:auto 5% auto auto;
    display:none;      
    text-wrap:normal;
}

Javascript used for the Label:

 <script>
    $(document).ready(function () {
        $('#<%= se.ClientID %>').fadeOut(10000);
    });
 </script>

C# code-behind used for the label: Here, I change the CSS by using the attribute [display:inline]

So, the text in the label can be seen on button click.

protected void b1_Click(object sender, EventArgs e)
{
    se.Attributes.Add("style", "display:inline");
    se.Text = "Ok";   
}

Answer №1

In order for the asp:Label with the ID="se" to be updated during an Async postback, it must be within the UpdatePanel.

Answer №2

Give this a shot: Make sure your labels are placed within the update panel. Use this updated code that worked perfectly for me.

<div>
    <asp:scriptmanager id="ScriptManager1" runat="server"></asp:scriptmanager>
    <asp:updatepanel id="UpdatePanel1" runat="server" updatemode="Conditional">
        
                    <Triggers>
                
                        <asp:PostBackTrigger ControlID="b1" />
        
                    </Triggers>
                    <ContentTemplate>
              <div>
              <asp:Label ID ="se" CssClass="mess" runat="server"> </asp:Label>
              </div>
              <div>
              <asp:Button ID="b1" runat="server"  Text="Submit."  />
              </div>
              </ContentTemplate>
              </asp:updatepanel>
    </div>

Take a look at the screenshots below to see the panel in action.

The update panel is now functioning properly.

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

Angular 7 router navigate encountering a matching issue

I created a router module with the following configuration: RouterModule.forRoot([ {path: 'general', component: MapComponent}, {path: 'general/:id', component: MapComponent}, {path: '', component: LoginComponent} ]) Sub ...

Executing a closure within a promise's callback

Currently, I am working on implementing a queue system for a web application in order to locally store failed HTTP requests for later re-execution. After reading Mozilla's documentation on closures in loops, I decided to create inner closures. When ...

Ensure that the GraphQL field "x" with type "[User]" includes a selection of subfields. Perhaps you intended to specify "x{ ... }" instead

I am encountering an issue while attempting to execute the following simple query: {duel{id, players}} Instead, I received the following error message: Field "players" of type "[User]" must have a selection of subfields. Did you mean & ...

Prevent scrolling after every time the mouse wheel is used

I have created a function that increments a class on a list item, here is the code snippet: var scrollable = $('ul li').length - 1, count = 0; $('body').bind('mousewheel', function(e) { if (e.originalEvent.wheelDelta / ...

What causes jquery-ui resizable to set the width of the div with the "alsoResize" property?

I have created a series of divs structured like this: <div id="body_container"> <div id="top_body"> </div> <div id="bottom_body"> </div> </div> Additionally, I have implemented the following funct ...

The array is devoid of any elements, despite having been efficiently mapped

I'm facing some challenges with the _.map function from underscore.js library (http://underscorejs.org). getCalories: function() { var encode = "1%20"; var calSource = "https://api.edamam.com/api/nutrition-data?app_id=#&app_key=#"; _.m ...

Clicking on an anchor tag will open a div and change the background color

.nav_bar { background: #c30015; margin-left: 50px; float: left; } .nav_bar ul { padding: 0; margin: 0; display: flex; border-bottom: thin white solid; } .nav_bar ul li { list-style: none; } .nav_bar ul li a { ...

Guidelines for accessing the value of the parent function upon clicking the button within the child function?

I have a pair of buttons labeled as ok and cancel. <div class="buttons-div"> <button class='cancel'>Cancel</button> <button class='ok'>Ok</button> </div> The functions I am working wi ...

Issue with Adding Additional Property to react-leaflet Marker Component in TypeScript

I'm attempting to include an extra property count in the Marker component provided by react-leaflet. Unfortunately, we're encountering an error. Type '{ children: Element; position: [number, number]; key: number; count: number; }' is n ...

Organizing DIVs upon website initialization

My website features a layout with three columns: <div id="column1"></div> <div id="column2"></div> <div id="column3"></div> I currently have 3 divs on the webpage: <div id="1">aaa</div> <div id="2">b ...

Avoid having individual words centered on a single line of text

Currently, I'm in the process of developing a website using WooCommerce, WordPress, and Elementor. I've encountered an issue where only one word appears on each line and have tried various solutions such as hyphens, word-break, and line-break wit ...

Exploring the Various Path Options in Angular 2 Routing

As a newcomer to Angular and Node JS, I am currently working on an application and struggling with how to efficiently navigate between my different components. Users can input the name of a user and add books associated with them When clicking on a book ...

Exploring potentials in OpenLayers by filtering characteristics

Is there a way to filter map features based on their properties? For example, if I have the following property in the geojson: ... "properties": { "Start": 10 } ... How can I make it so that only features w ...

Create a custom route variable in Node.js with Express framework

Is there a way to achieve this particular task using express.js? In my express.js application, I have set up a route like so: app.get('/hello', (req, res) => { // Code goes here }); This setup is functional, but I am curious if it is poss ...

What are some effective methods for storing DateTime in cookies?

Currently, I am working on an ASP .NET project and using the following code to store and retrieve DateTime values in cookies: HttpCookie cookie = new HttpCookie("myCookie"); if (Request.Cookies["myCookie"] != null) { cookie = Request.Cookies["myCookie ...

Updating the appearance of tabs in React Native Navigation dynamically during runtime

I am currently working with the startTabBasedApp API, which includes three tabs in my app. I have a requirement to change the background color of the tabBar for specific screens dynamically. Is it possible to achieve this at runtime? For instance: Scree ...

A guide to building a dynamic form slider that showcases variable output fields with Javascript

I'm interested in creating a Slider Form that shows different output fields when sliding, using Javascript. Something like this: https://i.sstatic.net/3Isl4.png Could anyone provide suggestions on how to achieve this or share any links related to so ...

Insert elements to an XML document in Node.js using libxmljs

I've been working on updating an XML file by adding a new child node using the code below: var libxml = require('libxmljs'); var xml = '<?xml version="1.0" encoding="UTF-8"?>' + '<root>' + ...

Error: The function clickHandler has been referenced before it was declared or it has already been declared

Since I started using JSLint, I have encountered the common issues of "used before defined" and "is already defined." While I found solutions for some problems, I am currently stuck. Here is a snippet of my code: var foo; foo = addEventListener("click" ...

Unlock the power of json data traversal to derive cumulative outcomes

Our goal is to populate a table by parsing a JSON object with predefined header items. (excerpt from an answer to a previous query) var stories = {}; for (var i=0; i<QueryResults.Results.length; i++) { var result = QueryResults.Results[i], ...