What is the proper way to invoke a function in the code-behind using JavaScript?

I need to invoke a function in the code behind from JavaScript

Button :

<button class = "btn btn-outline btn-danger dim" type = "button" onclick = "confirmDelete ()"> <i class = "fa fa-trash"> </i> Delete </button>

Javascript function :

<script>
     function confirmDelete () {
         if (confirm ('Are you sure you want to delete this?')) {
             // call function Delete_Click ();
         }
         return false; // always cancel the click event
     }
 </script>

The function I am trying to call:

protected void Delete_Click (object sender, EventArgs e)
     {
         try
         {
             Delete item
         }
         catch (Exception ex)
         {
             SetError (ex.Message);
         }
     }

If I use <asp: Button> or <asp: LinkButton>, some CSS styles are not being displayed. That's why I am using

Answer №1

To start with, modify your button by incorporating the attributes runat, Id, OnClientClick, and OnClick event:

<button Id="MyButton" runat="server"
class="btn btn-outline btn-danger dim" type="button"
OnClientClick="return confirmDelete()"
OnClick="DeleteItem_Click">
<i class="fa fa-trash"> </i> Delete
</button>

Next, update your JavaScript function accordingly:

function confirmDelete() {
    return confirm('Are you certain you wish to proceed with the deletion?');
}

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

Building a solid foundation for your project with Node.js and RESTful

I need to integrate a legacy system that offers an api with rest/json queries in Delphi. I plan to consume this data and build an app using angular + nodejs. My goal is for my application (client) to only communicate with my web-server on nodejs, which wil ...

Access the Express server by connecting to its IP address

Is it feasible to connect to an express server using the server's UP address? If so, how would one go about doing this? (Examples of code snippets would be greatly appreciated) ...

What is the best way to connect click events with ExtJS template elements?

Is there a way to assign a click event to each link tag without directly embedding onclick=.... in the XTemplate code? new Ext.XTemplate( '<ul>', '<tpl for="."><li><a href="#{anchor}">{text}</a></li& ...

JavaScript is having trouble locating the HTML select element

Having trouble selecting the HTML select element with JavaScript? You're not alone. Despite trying different solutions found online, like waiting for the window to fully load: window.onload = function(){ var opt = document.getElementsByName("prod ...

Uh-oh, Ajax encountered a 500 Internal Server Error!

Utilizing ajax to fetch events from my database has hit a snag. Instead of displaying the results, there is nothing visible on the screen, and the console is showing this error message: POST http://www.example.com/system/live_filter.php 500 (Internal Se ...

Unlocking the Controller Action: Navigating from a Component Controller in Ember

I am currently trying to enhance the functionality of an Ember component. The specific component I am working on is located here: app / templates / programmers.hbs {{echo-hlabel-tf id= "id-test-hlabel" class="class-test-hlabel-mio" label="Horiz ...

Unable to open fancybox from a skel-layer menu

Seeking assistance with integrating a Fancybox inline content call from a Skel-layer menu (using the theme found at ) <nav id="nav"> <ul> <li><a href="#about1" class="fancybox fancybox.inline button small fit" >about< ...

Tips for integrating Series data into Highcharts using MVC

Looking at this JFiddle demonstration of Highcharts http://jsfiddle.net/yxz80f4u/9/ We can observe the data being inserted as [Date.UTC(YYYY,MM,DD,HH,MM,SS), Y-data-point] data: [ [Date.UTC(1970, 7, 5,1,1,1), 2.22], [Date.UTC(1 ...

Converting HTML into an object using $compile

I am currently working on calling an HTML template and want to bind the data with Angular. I successfully retrieve the data to bind and the HTML, but when I try to compile it, it returns all the HTML binded as an object. How can I convert it back to plain ...

Is there a way to prevent the slide-out bar from automatically hiding when selecting an item from its list?

I am facing an issue with my dashboard that has a slideout sidebar. Whenever I press the toggle button, the sidebar slides out as expected. However, when I click on any tab within the sidebar, it hides again. I only want it to hide when toggled. My code is ...

What is the best way to combine JavaScript objects with identical values?

We have a task to compare each input key with others to find any common values. If there are common values, we need to concatenate them together and display the pairs. If no common values are found, then an empty array should be displayed as output. inpu ...

Display information from a .js file onto an HTML webpage

I'm completely new to the world of server-side development and I'm attempting to navigate it on my own. Currently, I have a server written in JavaScript using Express and I'm trying to display some content on my HTML page that was sent from ...

How to change a string from utf-8 to iso-8859-1 using Javascript

Although it may seem unpleasant, it is essential. I am facing an issue with a HTML form on my website that uses utf-8 charset but is sent to a server operating with iso-8859-1 charset. The problem arises when the server fails to interpret characters commo ...

Querying a document by its Id using only JSON in MongoDB

I am trying to query a document in Mongodb (2.6.1) using pure JSON without using ObjectIds. According to the mongodb extended json documentation, I expected the code db.collection.findOne({"_id": {"$oid": "51b6eab8cd794eb62bb3e131"}}) to work but it is th ...

Font in Three JS not loading properly

I'm attempting to use TextGeometry in my project to incorporate text. var shape = new THREE.TextGeometry( 'Hello, World!', { size: 60, height: 20, curveSegments: 3, font: 'helvetiker', weight: ' ...

Leveraging ng-change in AngularJS when utilizing the "Controller As" syntax

Attempting to steer clear of using $scope within my controller function, I have instead chosen to use var viewModel = this; employing the "controller as" viewModel syntax. The issue at hand is that while I can access data from a service, invoking functio ...

Trouble encountered when utilizing jQuery for XML to HTML conversion and vice versa (CDATA mistakenly transformed into HTML comments)

I am in the process of developing a plugin/bookmarklet that is designed to extract an XML document from the <textarea> element on a web page, make modifications to the XML content, and then reinsert the updated version back into the <textarea> ...

I am facing difficulties retrieving the JSON object returned from the Express GET route in Angular

After setting up an express route, the following JSON is returned: [{"_id":"573da7305af4c74002790733","postcode":"nr22ry","firstlineofaddress":"20 high house avenue","tenancynumber":"12454663","role":"operative","association":"company","hash":"b6ba35492f3 ...

Display a new Bootstrap 5 modal page using an iframe and a dynamic query string

Here is a snippet of my news list: <button data-bs-toggle="modal" data-id="1" data-bs-target="#exampleModal">Readmore</button> <button data-bs-toggle="modal" data-id="2" data-bs-target=" ...

Guide to transferring a JavaScript/Ajax variable to a PHP webpage with the help of AJAX

function initiateIperfSpeedRequest(speedVar, actualIp) { var xmlhttp = getAjaxObject(); xmlhttp.onreadystatechange = function () { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { handleIperfResponse(xmlhttp.respo ...