How can two functions be triggered simultaneously on a single event, one being a client-side JavaScript function and the other a server-side function

Is it possible to call two functions on the same event, one client-side and the other server-side? I need to achieve this. 

 <input type="text" ID="txtUserName" runat="server" maxlength="50"
                            class="DefaultTextbox" style="width:180px;" value="" 
                            onfocus="ControlOnFocus('', this, spanUserName);"
                            onblur="ControlOnBlur('',this, spanUserName); "
                            />

onblur="ControlOnBlur(); function2();

Would the code above work for calling two functions simultaneously?

onblur="ControlOnBlur(); function2();
c#asp.netjavascriptasp.net-ajax

Answer №1

Yes, that is accurate. Although defining events directly in HTML is generally not recommended, it is functional. Anything enclosed within " and " in onblur="" is interpreted as a single JavaScript code block. This means you have the freedom to input any code within it, even your entire program if desired.

onblur="line1; line2; line3;"

Answer №2

In the case of utilizing web forms and needing to send data back to the server for processing a server-side event, one option is to use the __doPostBack(this.name, '') method to initiate the postback. While there is an alternative method involving using a server side event to output (such as GetClientResourceUrl or a similar function), I personally prefer the __doPostBack approach for handling the postback process.

Alternatively, when working with MVC, you can trigger an action method by using either $.get or $.post, like this: $.get("/Controller/Action", function(result) { }). Unlike in web forms, directly invoking a method is not supported. Instead, in web forms, you have the option to invoke a web service or a page method.

Hope this helps!

Answer №3

One way to achieve this is by utilizing a local JavaScript function and triggering a request to the server through an asynchronous call using Ajax. Unfortunately, it is not possible to directly invoke a server-side method from the client side.

When using jQuery, the code snippet below demonstrates how this can be implemented:

$("#txtUserName").blur(function(e){
  ControlOnBlur(); // invoking the initial function
  $.post("/methods", {methodName:"refreshData", function(results){
    /* The 'results' variable holds the data returned from the server */
    alert(results);
  });
});

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

Having difficulty saving data in database using Ajax request from a Chrome extension

I am currently working on an extension that captures the page URL and saves it in a database once the user clicks the submit button. However, I have encountered a roadblock and believe there might be a missing piece in the extension setup that I cannot pi ...

javascriptphpajaxgoogle-chromegoogle-chrome-extension

Embed full content in iframe using bootstrap 4

Embedding an iframe of an appointment scheduling frontend on my page has been a challenge. While the width is correct, the height of the frame is too small. Despite attempting various CSS modifications, I have not been able to achieve the desired result. I ...

javascriptcssbootstrap-4

Instructions on creating a solid wall in Three.js using boxGeometry to prevent objects from passing through

I recently created a 3D maze using threejs, where I utilized BoxGeometry to construct walls that the game object cannot pass through. In my research, I discovered the importance of collision detection in ensuring the object does not go through the wall. ...

javascriptthree.js

Create a custom chrome browser extension designed specifically for sharing posts on

I'm working on creating a basic chrome extension that features an icon. When the icon is clicked, I want the official Twitter window to pop up (similar to what you see here). One common issue with existing extensions is that the Twitter window remains ...

javascriptgoogle-chrometwitter

What is the process for separating static methods into their own file and properly exporting them using ES6?

After exploring how to split up class files when instance and static methods become too large, a question was raised on Stack Overflow. The focus shifted to finding solutions for static factory functions as well. The original inquiry provided a workaround ...

javascriptnode.jses6-class

Struggling with implementing a personalized zoom feature in React-Leaflet?

Looking to create a custom Zoom button using react-leaflet Below is the code I have been working on: import React from 'react'; import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider'; import { Map, TileLayer } from 're ...

javascriptreactjsleafletreact-leaflet

Using Python, Scrapy, and Selenium to extract dynamically generated content from websites utilizing JavaScript

I am currently utilizing Python in combination with Selenium and Firefox to extract specific content from a website. The structure of the website's HTML is as follows: <html> <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8"> ...

javascriptpythonhtmlseleniumscrapy

Managing asynchronous requests on queries using node.js

I'm currently facing some challenges in managing asynchronous calls on queries. How can I ensure that I receive the responses in the correct order? I have a user array containing a payload of JSON objects. My goal is to insert the user and their deta ...

javascriptnode.jsasynchronousnode-mysql

Implementing jQuery UI autocomplete with AJAX for dropdown menu

Having an issue after selecting an option <select name="opcoes" onchange="showInfo(this.value)"> <option value="1">one</option> <option value="2">two</option> </select> An option value is sent through this function sh ...

javascriptphpjqueryajaxautocomplete

D3.js: Unveiling the Extraordinary Tales

I'm currently working on a project that requires me to develop a unique legend featuring two text values. While I have successfully created a legend and other components, I am facing difficulties in achieving the desired design. Specifically, the cur ...

javascripthtmld3.js

Learn about Angular8's prototype inheritance when working with the Date object

In my search for a way to extend the Date prototype in Angular (Typescript), I stumbled upon a solution on GitHub that has proven to be effective. date.extensions.ts // DATE EXTENSIONS // ================ declare global { interface Date { addDa ...

javascriptangulartypescriptdate

Transferring arrays through curl command to interact with MongoDB

Here is my mongoDB schema used for storing data: const mongoose = require("mongoose"); const subSchema = require("../../src/models/Course"); const All_CoursesSchema = new mongoose.Schema({ Student_name: { type: String, required: true ...

javascriptnode.jsmongodbexpresscurl

Inputing array elements into a dropdown menu

I have been working on a piece of code that involves inserting values into a listbox and then sorting them alphabetically for display in the same listbox. However, despite no errors appearing, whenever I click the button, the listbox clears itself instea ...

c#asp.netarrayssortinglistbox

What is the best way to show search results in real-time as a user

While working on a search box feature that filters and displays results as the user types, I encountered an issue where the search results keep toggling between showing and hiding with each letter input. As a beginner in JS, I am hoping for a simple soluti ...

javascriptjqueryfull-text-searchtoggle

Why is my jQuery blur function failing to execute?

Currently, I am working with HTML and the jQuery library to avoid core JavaScript in order to maintain consistency. In my project, there are 3 fields and when a user clicks on field1 and then somewhere else, I want only field1's border to turn red. T ...

javascriptjquery

Can you explain the concept of Cross-origin requests?

My JavaScript application is designed to detect single, double right, and double left clicks. A single click triggers an asynchronous request to the HTTP server, while the rest are intended to change the user interface on the client side. However, I am str ...

javascriptjqueryajax

Necessary workaround needed for HTML time limit

Our HTML page has been designed to automatically timeout after 10 minutes of inactivity. This functionality is achieved through the following code: function CheckExpire() { $.ajax({ type:'GET', url:self.location.pathname+"?ch ...

javascripthtmlajax

What steps do I need to follow in order to perform a particle design simulation on my laptop

Recently, I attempted to utilize some of the particle designs featured on this website https://speckyboy.com/particle-animation-code-snippets/, but encountered difficulties. I have included both the stylesheet and javascript files, yet the design does not ...

javascripthtmlcss

Sharing and showcasing files directly from a local directory

Recently diving into NodeJS and web development, I've successfully used multer to upload a single file within my web application. The file gets uploaded to my "uploads" folder flawlessly, and now I'm planning on storing the file path in my databa ...

javascriptnode.jsexpressuploadmulter

Guide to integrating a static page with personalized CSS and JavaScript resources within a Rails project

Currently, I am developing a simple Rails application (using Rails version 4.1) and I am looking to incorporate a static page into it. The static page is structured as follows: | |- index.html |- css folder |-- (various css files) |- js folder |-- (some j ...

javascripthtmlcssruby-on-railslayout