Send a C# list to the controller using JavaScript

I am struggling to figure out how to pass a full list using Ajax. I have a C# list in my cshtml file and I need to send it to the controller through Ajax. While I know how to pass simple variables, passing a full list of objects is proving to be a challenge. Below is a snippet of my current JS script:

$.get("/home/function?List=" + SthList, function (r) {
    $("#Table").html(r);
});

The issue appears to be that SthList is not a JSON object. Using Razor does not seem to make a difference either.

My controller looks like this:

public ActionResult function(List<Object> List)
{
    ...
    return PartialView(sth);
}

If you have any tips or suggestions on how to properly pass a full list via Ajax, I would greatly appreciate it!

Answer №1

Start by converting your C# Array into a JsArray. This can be achieved by combining razor and javascript code.

If you're wondering how to perform this conversion (specifically, how to convert a C# array into a JS array), check out this helpful discussion on Stack Overflow: Mix Razor and JavaScript

Another challenge may arise when trying to pass an array via ajax to the controller.

To address this issue, refer to the following question on Stack Overflow for guidance: Post array to MVC controller

By exploring these queries, you'll likely find the solutions you need.

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

Displaying JSON data in a popup window resembling a download prompt

I'm a beginner in front end development and facing difficulty in displaying JSON in a new window. Currently, I'm allowing users to download the JSON file like this var blob = new Blob([$scope.data], {type: 'json'}); ...

What is the best way to dismiss the additional modal popup?

Here is an example that I need help with: http://jsfiddle.net/zidski/Mz9QU/1/ When clicking on Link2 followed by Link1, I would like the Link2 box to close automatically. Is there anyone who can assist me with this issue? ...

Creating interactive network visualizations using JavaScript

I've been in search of javascript code that can help me create a visual representation similar to this example. Specifically, I need something that can display links between boxes when clicked on or hovered over. I'm still not sure what this par ...

Tips for avoiding label overlap in JavaScript programming

I am having some trouble adding labels to a sphere. Only one label is attaching correctly, while the rest are overlapping in the corner of the screen. I have attached an image to show the issue. It may be a CSS problem, but I'm not entirely sure. Belo ...

How can the CSS inside the editor be customized in ng2-ckeditor?

I am looking to customize the functionality of the ENTER key in ng2-ckeditor. I have read about a config option that can help with this on this site. It seems that custom CSS is recommended for making these changes: To adjust paragraph spacing, it is sug ...

Is it possible to create a Facebook reveal tab using either Javascript or .NET?

As a developer who jumped into Facebook development just before the recent changes, I am feeling lost when it comes to building apps now. I see many questions similar to mine about creating fan-gating features using Javascript only. Is there an up-to-date ...

Animating content to slide into view in the same direction using CSS transitions

My goal is to smoothly slide one of two 'pages', represented as <divs>, into view with a gentle transition that allows the user to see one page sliding out while the other slides in. Eventually, this transition will be triggered from the ba ...

Changing a standard method to asynchronous is creating problems with the generic parameters

Within a static class named StaticHelper, there exists the following static generic method: public static class StaticHelper { public static TResponse GenericMethod<TResponse, TRequest>(TRequest request, ...

Is it possible to modify a single value in a React useState holding an object while assigning a new value to the others?

In my current state, I have the following setup: const [clickColumn, setClickColumn] = useState({ name: 0, tasks: 0, partner: 0, riskFactor: 0, legalForm: 0, foundationYear: 0 }) Consider this scenario where I only want to update ...

I'm encountering issues with saving data via ajax because of datetime and foreign key constraints

I need assistance with storing vacation data for a specific employee based on the employee ID obtained from the URL. Currently, when I select an employee from a list, the code displays their associated vacations, and I would like to add a new entry. Can yo ...

Error in Google Chrome caused by TypeScript

Here is a TypeScript file snippet that I'm working on: module MyOrganization { export module Software { export class VersionInfo { private _Major: number = 0; private _Minor: number = 0; pri ...

The cmdlet name "ng" within Angular is not a recognized term

Exploring angular for the first time by working on a project developed a few months ago. Current versions: node v 12.13.1, npm v 6.12.1 Operating on a Windows system. Encountering issues with the ng command - "the term ng is not recognized as the name o ...

What steps should I take to ensure my .js.erb files are compatible with Rails 7?

I have been following a Rails Tutorial on Building a Link Shortener with Rails 6 and Ruby 2.xx to create an app. However, I am using Rails 7.0.4 and Ruby 3.0.0. I encountered an issue with my create.js.erb file not functioning properly. After some research ...

Exploring Vue 3: A guide to sending an array of items to a directive

As I couldn't find an existing IntersectionObserver library for Vue 3, I am planning to create my own custom solution. After researching about directives, it seems like the right approach. (?) This is my local directive: directives: { 'lazy ...

Using PHP and AJAX, populate a table based on the selection made from a dropdown

Hello, thank you for taking the time to review my issue. Let me outline the objective. I have successfully implemented two drop-down menus that are populated dynamically from a database. The query retrieves names and phone numbers (with plans to fetch mor ...

Removing the gap between the clicked point and the draw point in Html5 canvas

To better understand my issue, please refer to the image linked below: In the image, you can see that when I scroll down and click on the canvas to point a position, it creates space between the clicked point and where the line is drawn. Below is the cod ...

Dealing With HttpClient and Asynchronous Functionality in Angular

I've been pondering this issue all day. I have a button that should withdraw a student from a class, which is straightforward. However, it should also check the database for a waiting list for that class and enroll the next person if there is any. In ...

Is there a way to use an AJAX PHP call to return an array or JSON object that contains nested JSON objects?

My goal is to retrieve the results of a mysql query and display them in my jQuery. I have managed to put each row of the query results into its own JSON object, but now I am facing difficulty when there are multiple lines of results that need to be returne ...

Unique title: "Implementing Unique Event Handlers with VueJS Components"

My VueJS and Buefy project begins with two distinct click actions: Click on the Cyan area -> redirects to another page (Action 1) Click on the Magenta area -> shows a dropdown menu (Action 2) https://i.stack.imgur.com/AVLOS.png However, when clic ...

Switching Story Tense on Facebook Open Graph

After creating a unique story for my facebook app, I discovered that when making a basic story post using the facebook js sdk, the resulting post is in past tense and depicts the object in singular form. For example, instead of saying: John is eating an a ...