Is javascript works async as default??

Hi Gopi,

In JavaScript, specifically AJAX / fetch calls are asynchronous by default, and calling a controller via JavaScript will NOT automatically navigate to the view it returns.

That’s exactly why you’re seeing the same view instead of the one returned by the controller.

Why this happens

When you click a button and call a controller using JavaScript (AJAX / fetch / $.ajax):

• The request is sent in the background

• The browser does not perform a page navigation

• The controller may return a View, but:

  • That HTML is returned as data, not as a page load

  • The current page remains unchanged unless you explicitly do something with the response

So even though your controller is correct, the browser stays on the same view.

Example of the problem

Controller

public ActionResult MyAction()
{
    return View("AnotherView");
}

JavaScript call

$.ajax({
    url: '/Home/MyAction',
    type: 'GET',
    success: function (response) {
        // response contains HTML, but nothing happens automatically
    }
});

Result: Same page stays visible

Correct ways to handle this

Option 1: Redirect using JavaScript (most common)

If you want to navigate to another view, don’t use AJAX:

function goToPage() {
    window.location.href = '/Home/MyAction';
}

This performs a full-page request and loads the returned view.

Option 2: Use AJAX and inject the returned view

If you do want async behavior:

$.ajax({
    url: '/Home/MyAction',
    type: 'GET',
    success: function (html) {
        $('#content').html(html); // inject returned view
    }
});

HTML:

Useful for partial page updates

Option 3: Return JSON and redirect explicitly

Controller:

return Json(new { redirect = "/Home/AnotherView" });

JavaScript:

success: function (data) {
    window.location.href = data.redirect;
}

Option 4: Use PartialView for AJAX calls (recommended)

Controller:

return PartialView("_AnotherPartialView");

JavaScript:

$('#content').html(response);

Answer to your direct question

Is JavaScript async by default?

• No, JavaScript is synchronous and single-threaded by default. This means that code is executed line by line, in a blocking manner, with each operation completing fully before the next one begins.

• Asynchronous behavior in JavaScript is achieved through specific mechanisms and APIs provided by the JavaScript runtime environment (like a web browser or Node.js), not the core language itself. 

• Yes, AJAX / fetch / jQuery calls are asynchronous by default. They do not trigger page navigation

• Returning a View from a controller does not mean the browser will display it

Rule of thumb

In summary, while JavaScript's runtime is fundamentally synchronous, its environment and modern language features like async/await enable robust asynchronous capabilities for building responsive applications.

No, that is not the purpose of ajax. anchor tags are used for that purpose.

or

window.location.href = abc.com?a=1&&b=2

Hi Sachin,

As per my knowledge ajax calls returns the results in same view. But I want to display the results in new view file. Is it possible in Ajax.

It's not about javascript rather ajax. You must be making an ajax call, and you are getting the correct (new html) returned inside the sucess function but you are not using it (setting /replacing the current page with returned one).

Hi Gopi,

For your issue you can set async : true or false, in $.ajax({ method using jQuery

Fore more details:

• When to use async false and async true in ajax function in jquery
  • https://stackoverflow.com/questions/18366118/when-to-use-async-false-and-async-true-in-ajax-function-in-jquery

Hope this will help you!

Hello Gopi

By default, JavaScript is a synchronous, single-threaded programming language. This means that instructions can only run one after another, and not in parallel. Consider the little code snippet below:

let a = 1;
let b = 2;
let sum = a + b;
console.log(sum);

The above code is pretty simple – it sums two numbers and then logs the sum to the browser console. The interpreter executes these instructions one after another in that order until it is done.

But this method comes along with disadvantages. Say we wanted to fetch some large amount of data from a database and then display it on our interface. When the interpreter reaches the instruction that fetches this data, the rest of the code is blocked from executing until the data has been fetched and returned.

Now you might say that the data to be fetched isn't that large and it won't take any noticeable time. Imagine that you have to fetch data at multiple different points. This delay compounded doesn't sound like something users would want to come across.

Luckily for us, the problems with synchronous JavaScript were addressed by introducing asynchronous JavaScript.