Deactivating an asp.net label using client-side scripting

Having a web form with numerous controls and a submit button can be tricky. The issue arises when a user initially submits clean data, resulting in the display of a "form submitted successfully" message using an asp.net label control. However, if the same user later enters invalid values for certain fields on the form and clicks submit again, both the success message and validation error messages are displayed.

The challenge now is how to eliminate the success message in this situation so that only the client-side validation error messages are shown. This may require some knowledge of JavaScript, which I don't have expertise in.

<asp:Button ID="btnAddActivity" Text="Add Activity" runat="server" onclick="btnAddActivity_Click" ValidationGroup="vgSetup" OnClientClick=" return changeLabel();"/>

<asp:Label ID="lblMessage" visible="false" ForeColor="red" runat="server"></asp:Label> 

function changeLabel()
{
    document.getElementById('<%= lblMessage.ClientID %>').innerHTML = "";

    return; 
}

Attached is the markup for the label and button. Attempting to call a JavaScript function during the OnClick event effectively disables the success message, but it unfortunately results in the validation error messages appearing after a post back. Ideally, I would like the validation error messages to show without requiring a post back. Any assistance or guidance on resolving this issue would be greatly appreciated.

Answer №1

Give this a try:

<asp:Button ID="btnAddActivity" Text="Add Activity" runat="server" onclick="btnAddActivity_Click" ValidationGroup="vgSetup" OnClientClick ="modifyText();"/>


function modifyText()
{
        if !(Page_ClientValidate())
        {
               document.getElementById('<%= lblMessage.ClientID %>').innerHTML = "";
        }

}

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

Showing a div element with the power of JavaScript

I want to enhance the accessibility of my website for users who do not have JavaScript enabled. Content that will be visible if the user has JavaScript enabled. Content visible when JavaScript is disabled. By default, DisableJS is set to Display:none; ...

Struggling to set up a WebSocket server with the express-ws middleware

I have been working on setting up a websocket server with node.js and express, using the express-ws middleware to assist me. Unfortunately, I am encountering an issue where the client is unable to connect to the server. Below is a snippet of my code. app. ...

Is it necessary to define module.exports when using require() to import a file?

While setting up my Express server, I am using Babel to transpile my ES6 files seamlessly. In my vanilla JS server.js file, I include require('babel-core/register') and require('./app'). Within my ES6 file app.js, I handle all the usua ...

Error encountered: Unexpected token found while trying to import react-native-fetch-blob

We are facing an issue while trying to incorporate the react-native-fetch-blob package into our project using the code snippet below: const RNFetchBlob = require('react-native-fetch-blob'); const firebase = require('firebase'); Howeve ...

Creating packing features specifically designed for resolution within a reusable module

I've decided to revamp my Angular application based on John Papa's style guide (well, mostly) and my main focus is on improving modularity. The stumbling block I've encountered is with route resolves. So far, I've been using a global ap ...

Run your node.js project on the internet

I have a node.js and socket.io project that I want to run on my server online. Using jade, I have organized everything in my local folder and successfully ran it locally. However, I now need to connect my phone to control my browser, which is not possible ...

The functionality for selecting text in multiple dropdown menus using the .on method is currently limited to the first dropdown

Having trouble selecting an li element from a Bootstrap dropdown and displaying it in the dropdown box? I'm facing an issue where only the text from the first dropdown changes and the event for the second dropdown doesn't work. <div class="dr ...

Utilizing onMouseEnter and onMouseLeave events in React using hooks

My goal is to create a drop-down menu with a delay, allowing users to hover over the child list items before they disappear. However, I seem to have made an error somewhere but can't pinpoint it. It's likely just a simple mistake that my eyes are ...

Utilizing the "return" keyword in Javascript outside of function declarations

Exploring the Impact of Using the Return Keyword in JavaScript Scripts Beyond Functions in Browsers and Node.js Recently, I experimented with utilizing the return keyword in a Node.js script like so: #!/usr/bin/env node return 10; My initial assumption ...

When running `npm run dev` on webpack-dev-server, I encountered a TypeError stating that the property `port` cannot be set on an

Running node v10.15.1, vue js, vue-cli, and vue-loader with webpack, http-proxy-middleware (included) on a local win10 x64 remote host has been successful. Bootstrap v4 and bootstrap-vue were also installed and imported correctly. However, upon running np ...

Trouble with Leafletjs Routing Machine collapse button loading issue

In my project, I am using django 1.10.5, booststrap 4.0, and LeafletJs 1.0.3 along with the routing machine plugin and geocoder. However, I have encountered an issue where the collapse button of the control panel for the routing machine does not appear (it ...

Scope of MongoDB's `.findOne` method

Having trouble with variable scope. var max; ClassModel.findOne({ class: '1a' }, function (err, class1a) { if (err) return handleError(err); max = class1a.members; console.log(max); }); console.log(max); Why does ...

Tips for obtaining the value of a DataTable column using an array

I am working with a DataTable that I create in the following manner: DataTable data = new DataTable(); data.Columns.Add("year"); data.Columns.Add("month"); data.Columns.Add("id"); data.Columns.Add("displayText"); data.Columns["displayText"].Expression = ...

Detecting repeated property values within a collection of embedded objects

I am currently working with a JSON file that contains an array of nested objects and arrays to represent a shopping cart. My goal is to identify duplicate values and update the quantity of the item if duplicates exist, otherwise simply add the items to the ...

Despite having unique ids, two file input forms are displayed in the same div in the image preview

Running into a minor issue once again. It may not be the most eloquent query, but I'm genuinely stuck and in need of some assistance. I am attempting to showcase image previews of selected files in a file input form. I have a jQuery script that reads ...

The dropdown menu adjusts its value based on the selected radio button

When I select the "12 hour" radio button, the drop-down values change to 1 am - 12 am and 1 pm - 12 pm. If I select 24 hours, then the values change to 1-24. Below is my code: <script src="http://code.jquery.com/jquery-1.7.2.min.js"></script> ...

How to make Angular resolver and component share an injected service?

In my products list component, I have a table displaying various products. Since there is a considerable amount of data, I implemented a resolver to prevent the user from being directed to the page until all the data is loaded. The resolver currently utili ...

Double curly brace Angular expressions being repeatedly evaluated during mouse click events

Within our Angular application, the code structure is as follows: <div>{{ aGetProperty }}</div> <div>{{ aMethod() }}</div> Upon clicking anywhere on the page, these expressions are being evaluated repeatedly. For example, if there ...

Creating randomly colored rectangles using JavaScript

I've been working on a project where I want to input a number into a form and generate that many boxes with random colored backgrounds when I press go. Here is the current JavaScript code: <script type="text/javascript"> var number = 3; functi ...

experimenting with adding fresh choices to dropdown menu using ajax and jquery

When attempting to load a list of locations through ajax/jQuery, I encounter an issue. After typing a letter into the input field, the first response is displayed but subsequent responses are simply appended to it. I have tried using .html('') an ...