Posting a JavaScript string to a C# backend in ASP.NET Core MVC: A step-by-step guide

I am a beginner in ASP and facing an issue while attempting to pass a string from my JavaScript code to my controller. The intention is to utilize this string for querying my database.

JavaScript

function findEmployees(userCounty) {
    $.ajax({
        type: "POST",
        dataType: "json",
        url: '@Url.Action("Index", "Contact")',
        data: JSON.stringify(userCounty),
        contentType: "application/json",
        success: function (response) {
            alert(userCounty);
        },
        error: function (response) {
            alert("failed");
        }
    });
}

Controller

    [HttpPost]
    public ActionResult Index (string userCounty)
    {
        var query = //implement linq query on the database
        return View(query);
    }

Currently, I only receive the "success" alert when using a JsonResult function in my Controller. However, I need it to eventually return a LINQ query with the View(); function which hasn't worked with a JsonResult function. Any suggestions or alternate approaches would be greatly appreciated. If there is a better way than ajax to pass the string stored in userCounty to my controller, please let me know.

Answer №1

To update your controller method, follow these steps:

[HttpPost]
public IActionResult UpdateData([FromBody]string userInput)
{
    var query = //implement a database query using LINQ
    return View(query);
}

To display the page, you will require:

[HttpGet]
public IActionResult DisplayPage()
{
  return View();
}

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

AngularJs does not properly update the scope of a scoped directive when using ng-repeat within itself

The issue arises from calling Directive1 within the same Directive1 using ng-repeat. Although directive11 has a value in scope, when calling the nested directive with a new value, it appears to retain the initial value. I attempted to invoke the same dire ...

How to transfer a C library callback to a NodeJS EventEmitter with the help of node-addon-api

In the process of developing a node module that integrates Alex Diner's cross-platform gamepad code using the Node-Addon-API, I encountered an interesting challenge. Making the module function as an EventEmitter and exposing callback functions throug ...

Request Pending | Observation of WebSockets in NestJS

I'm currently working on a NestJS application that interacts with the Binance Websocket API to retrieve some data. While I am able to see all the data in my console.log, I'm facing an issue where the request seems to be pending when using Postman ...

Having trouble with Semantic UI Modal onShow / onVisible functionality?

Seeking assistance with resizing an embedded google map in a Semantic UI modal after it is shown. After numerous attempts, I have narrowed down the issue to receiving callbacks when the modal becomes visible. Unfortunately, the onShow or onVisible functio ...

Immersive jQuery slideshow embellished with an interactive counter, captivating thumbnails, dynamic progress bar,

Hey there! I'm currently working on my very first website and I could really use some assistance in creating a slider with images. I've tried searching for a solution to my problem online, but even after attempting to fix the suggested plugin, I ...

Verifying that the mapDispatchToProps functions have been triggered using ReactTestingLibrary

I am currently utilizing mapDispatchToProps to invoke a dispatch function that calls an API within the useEffect hook of my functional component. I am facing some challenges when attempting to write unit tests for this scenario using React Testing Library ...

Trigger .gif on hover using ng-repeat in AngularJS

Many solutions to this problem involve using jQuery, such as the following examples: Stop a gif animation onload, on mouseover start the activation and Animating a gif on hover. However, I'm interested in achieving the same functionality using Angular ...

The geocomplete function is not available for use with autocomplete

Hey there, I'm encountering an issue with autopopulated code. I keep getting the error "geocomplete is not a function" when trying to use it locally (in a separate file), but oddly enough it works fine for me in that context. Any idea what might be ca ...

A React component enclosed within a useCallback function

According to the React docs, to prevent a Child component from re-rendering in certain cases, you need to wrap it in useMemo and pass down functions in useCallback within the Parent component. However, I'm confused about the purpose of this implementa ...

Fetching dynamic JavaScript generated by PHP

I am creating a lightweight website and I have a piece of javascript code that I want to convert into a module by putting it in a separate file. This way, the code will only be loaded after a specific onClick event occurs. Successfully loading the javascr ...

"Populate the input fields in a table with the data retrieved from the AJAX request's

For my current project, I am utilizing an ajax request to select data from a database. The selected data includes the area and floor number of a building, formatted as follows: "storey": [{ "storeyno": "1st Floor", &qu ...

Silky animations in kinetic.js (html5 canvas)

I am seeking a better grasp on kinetic.js animation. Recently, I came across a tutorial at . After experimenting with the code provided, I managed to create an animation that positions my rectangle at x coordinate 100. However, I am struggling to achieve s ...

Is it possible to prevent the fade out of the image when hovering over the text after hovering over the div or image, causing the text to fade in?

Using React and CSS. I have set up my application to display a faded image on hover, with text that fades in over it. However, I am facing an issue where touching the text with my cursor removes the fade effect. Does anyone have a solution for preventing ...

Please refrain from refreshing the page multiple times in order to receive updated data from the database

Currently, I have created a countdown timer from 00:60 to 00:00. However, once the timer reaches 00:00, I am looking to refresh the page only once in order to retrieve a new value from the database. Does anyone have any suggestions on how to achieve this ...

How can I adjust the brightness, contrast, saturation, and hue in HTML5?

Is there a way to adjust the brightness without turning the image grey? I've been attempting to do so, but only managed to change it to greyscale. My objective is to increase and decrease the brightness of the image. Here is the current code: HTML ...

Guide on enabling a new input field in React when a dropdown option is selected by a user

I'm attempting to show an additional input field when the user selects "Other" from the dropdown menu. I have implemented a state for the input field that toggles between true and false based on the selected value from the dropdown. However, I am enco ...

I'm curious about the process behind this. Can I copy a Figma component from a website and transfer it into my

Check out this site for an example: Interested in how uikit.co/explore functions? By hovering over any file, a copy button will appear allowing you to easily paste it into your Figma artboard. Want to know how this works and how to implement it on your o ...

Chrome browser not triggering first click event for AJAX jQuery checkbox

My Java application is built with Struts 1.1, utilizing actions, forms, and business objects. To enhance performance, I have integrated AJAX into my code to fetch data quickly and display it in a grid. However, I encountered an issue where clicking on a ch ...

Pass for Achieving the Bokeh2 Effect

I'm attempting to transfer the Bokeh2 Depth of Field effect to an effect composer pass. Every time I try to run it, I encounter the following error: glDrawElements: Source and destination textures of the draw are the same. Below is the render functi ...

OBJ Raycasting in Three.js

Greetings! I encountered an issue while working with three.js in my project. Specifically, I was trying to select a custom mesh that I loaded from an OBJ file. To troubleshoot, I set up a simple raycaster, a cube, and my custom model (which is also a cube ...