The dropdown list event does not seem to be triggering when JavaScript is implemented

Having trouble triggering a dropdownlist event.

The dropdown in question:

asp:dropdownlist id="ddlhello" Runat="server" AutoPostBack="True"  onchange="javascript:return ChangeHeader();"

An associated selectedindex change event has been added in the code behind.

The issue arises when the page is executed: JavaScript runs, but the server-side code does not trigger. Removing 

onchange="javascript:return ChangeHeader();"
allows the server side code to work as expected.

Upon inspecting the source code, it appears that there are two onchange events linked — one for JavaScript and another for server-side processing.

Seems like the client-side code is being prioritized over the server-side code.

Uncertain about the cause, seeking insight into this behavior.

In search of a solution that will execute both server and client-side code simultaneously.

Tried searching for answers without success so far.

Your assistance is greatly appreciated.

javascriptasp.net

Answer №1

To connect the server-side event to a dropdown, use the onselectedindexchanged attribute instead.

onselectedindexchanged="DropDownList1_SelectedIndexChanged"

<asp:dropdownlist id="ddlhello" Runat="server" AutoPostBack="True"   onselectedindexchanged="DropDownList1_SelectedIndexChanged" onchange="javascript:return ChangeHeader();" </asp:dropdownlist>

If the client function returns false, it will prevent the postback.

function ChangeHeader()
{
 //return false; // will stop the postback
  return true; //will cause postback
}

Answer №2

Instead of using onchange="return ChangeHeader();" try using onchange="ChangeHeader();"

I trust this suggestion will be beneficial to you.

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

Vue enables components to be used in any part of the application, not limiting them to

Currently, I am initializing my Vue instance in the following manner: import ListClubsComponent from "./components/clubs/list-clubs.vue"; new Vue({ el: "#app", components: { "list-clubs": ListClubsComponent } }); It seems to be functi ...

javascriptlaravelvue.jsvuejs2laravel-blade

Unexpected error encountered with node.js when attempting to run: npm run dev. A TypeError was thrown stating that require(...) is not

Working on my initial project, I have set up a database and am in the process of creating a login page. However, when trying to run it using 'npm run dev', an error is encountered (see below). I am unsure of what is causing this issue and how to ...

javascriptreactjsnode.jsnpmnpm-start

Failure to execute the success function

My current issue involves making an AJAX call to retrieve a record from the database. Despite console logs showing that the record is successfully returned, the success function fails to execute. function ajaxForParent() { var search = document.getEle ...

javascriptjqueryajax

Managing multiple Sequelize DB connections in NestJS: A guide

I recently came across the example in the NestJS documentation regarding setting up a Sequelize DB connection. I'm curious about how to connect to multiple databases using Sequelize and TypeScript with NestJS. Can anyone provide guidance on this? ...

javascriptnode.jstypescriptnestjssequelize-typescript

Tips for excluding specific elements when clicking on a document

JavaScript $(document).click( function () { alert("Hello there"); } Web Development <div id="wrapper"> <div id="inner-1"> <div id="sub-inner1">Sub Inner1 Content</div> <div id="sub-inner2">Sub Inner2 Content&l ...

javascriptjquery

endless refreshing material ui accordion

Facing an issue with infinite rerender while trying to create a controlled accordion component using Material UI accordion. Here is the code snippet, any insights on why this could be causing an infinite rerender? const [expanded, setExpanded] = React.us ...

javascriptreactjsmaterial-ui

Uncover the structure of a regular expression pattern to discover the quantity of tokens and the size of the anticipated matches

I am looking to validate certain fields in my forms by determining the number of tokens and length specified by a particular regular expression. For example, For the pattern [0-9]{3},[0-9]{2}, I need to identify 5 as the length and 2 as the number of to ...

javascriptjqueryregex

"Exploring the Depths: How Node.js Utilizes Recursive Calls

I need assistance generating a comprehensive list of all users' flairs on a specific subreddit. To achieve this, Reddit breaks down the requests into chunks of 1,000 and offers both "before" and "after" parameters for fetching purposes. However, I am ...

javascriptnode.jsreddit

When working with Vue JS, consider utilizing a data or computed property that is dependent on the value of a particular prop. In this case, the prop being altered is named "

While using pagination, I encountered an issue where the nextPage method works fine but the previousPage method throws an error. The error message warns against directly mutating a prop as it gets overwritten whenever the parent component re-renders. It s ...

javascriptvue.jsvuejs2

Using Javascript/HTML to enable file uploads in Rails

I'm currently facing an issue with uploading and parsing a file in Rails, as well as displaying the file content in a sortable table. I followed a tutorial on to get started. This is what my index.html.erb View file looks like: <%= form_tag impo ...

javascriptjqueryhtmlcssruby-on-rails

Here is a way to attach a function to dynamically generated HTML that is returned in an AJAX request

As I was working on a new function development project, I encountered a situation where I had to add a function to dynamically generated HTML through an ajax call. The following is a snippet of the code: $.ajax( 'success': function(data){ ...

javascriptjqueryajax

Issue with HTTP headers not being effective in $.AJAX request

Regardless of the method I attempt to use for setting headers in an AJAX call, and no matter which header I set, every time there is a header present, the AJAX call is aborted and does not go through. However, if I try to make the call without setting any ...

javascriptjqueryajaxhttpget

Setting the default value to null or 0 in a Select dropdown in Angular 7

There is a select dropdown code that may be hidden in some instances. When the select dropdown is hidden, I want to ensure null or 0 is sent instead of an empty value when saving the form. How can I achieve this? <div class="col-md-4" [hidden]="!cpSe ...

javascriptangular

Observing the evolution of Vue with Observable notifications

I'm currently working on creating a method to verify a user's login status using firebase's firebase.auth().onAuthStateChanged(). My intention is to make this functionality accessible throughout my app as a global variable. Presently, I am ...

javascriptfirebasevue.jsgoogle-chrome-extensionfirebase-authentication

JS Unable to get scrollIntoView function to work with mousewheel event

I have been working with the script provided above. It correctly displays the id in the browser console, but unfortunately, it is not triggering the scrolling function as expected. var divID = null; var up = null; var down = null; function div(x) { s ...

javascripthtml

The Ajax function fails to trigger during the first load of the page

Note: Kindly refer to the update at the end of this question before proceeding. The problem described is specific to IE 11 and emerged after a recent Windows update. Following the installation of 5 updates, including one for IE, I removed the latter hopin ...

javascriptjqueryajaxinternet-explorer

IE10 has a problem with the height being set to 100%, but it seems to work fine in Quirks mode in IE and all

Check out this page for reference: I've noticed an issue with scrolling in Internet Explorer, while other browsers seem to be fine. Can you help me understand why IE is causing the scroll and how I can fix it? Thank you, Judson Here's the cod ...

javascripthtmlcss

How can I use JavaScript to trigger a button click event inside an iframe element

Is there a way to retrieve the inner HTML contents of a clicked element in an iframe loaded content using JavaScript? This code uses jQuery: var elements = document.getElementsByTagName('iframe'); [].forEach.call(elements, function(elem ...

javascripthtmliframe

Using the Unsigned Right Shift Operator in PHP (Similar to Java/JavaScript's >>> Operator)

Before marking this as a duplicate, please take a moment to read the information below and review my code * my updated code! The issue I am facing is that I need to implement Java/JavaScript '>>>' (Unsigned Right Shift / Zero-fill Rig ...

javascriptjavaphpbit-manipulationbit-shift

My attempts to utilize the local storage key have been unsuccessful in storing my todo list. I am uncertain where the issue lies within my code

I've been working on a Todo List with local storage in React, but I'm running into an issue. It seems that my todos aren't getting stored properly and are disappearing every time the page refreshes. I need to figure out what's causing t ...

javascriptreactjslocal-storage