C#•2y ago

❔ How to pass JS object to function.

How do I pass the JS object to the C# function in that it accepts it as an object of a defined Class? I looked at an example using Ajax (don't know if that has to do with anything). https://www.dotnettricks.com/learn/webapi/how-to-pass-javascript-complex-object-to-aspnet-web-api-and-mvc I'm getting null values. I tried removing JSON.stringify, but no luck.

// JS Object
const formData = { "startDate": startDateInput.value, "endDate": endDateInput.value, "stock": stock.value };

// Send to C# function
const response = await fetch('https://localhost:5681/api/stock/getStockData/' + JSON.stringify(formData));

// JS Object
const formData = { "startDate": startDateInput.value, "endDate": endDateInput.value, "stock": stock.value };

// Send to C# function
const response = await fetch('https://localhost:5681/api/stock/getStockData/' + JSON.stringify(formData));

// C# function
[HttpGet]
[Route("api/stock/getStockData/{formData}")]
public async Task<IActionResult> GetStockDataAsync(Stock formData)
{

}

// Stock Class
        public class Stock
        {
            public string stock { get; set; }
            public string? startDate { get; set; }
            public string? endDate { get; set; }
        }

// C# function
[HttpGet]
[Route("api/stock/getStockData/{formData}")]
public async Task<IActionResult> GetStockDataAsync(Stock formData)
{

}

// Stock Class
        public class Stock
        {
            public string stock { get; set; }
            public string? startDate { get; set; }
            public string? endDate { get; set; }
        }

Thank you

6 Replies

Anton•2y ago

huh I'm actually not sure it would even bind a route segment to a complex objecy you should use a post request for this tho send the object as the body of the request, and set the method to post well you should be able to figure it out by googling

James213•2y ago

Like this? Post doesn't even trigger a breakpoint, even if I have it like my original.

    const testResponse = await fetch('https://localhost:5681/api/stock/getStockData/' + {
        method: 'Post',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify({
            stock: formData.stock,
            startDate: formData.startDate,
            endDate: formData.endDate
        })
    });

    const testResponse = await fetch('https://localhost:5681/api/stock/getStockData/' + {
        method: 'Post',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify({
            stock: formData.stock,
            startDate: formData.startDate,
            endDate: formData.endDate
        })
    });

        [HttpPost]
        [Route("api/stock/getStockData/{formData}")]
        public async Task<IActionResult> GetStockDataAsync(Stock formData){
        }

        [HttpPost]
        [Route("api/stock/getStockData/{formData}")]
        public async Task<IActionResult> GetStockDataAsync(Stock formData){
        }

Angius•2y ago

Don't append that object to the URL It's a second parameter of the fetch()

var res = await fetch(url, {
    method: 'POST',
    headers: { 
        'Content-Type': 'application/json'
    },
    body: JSON.stringify(data)
});

var res = await fetch(url, {
    method: 'POST',
    headers: { 
        'Content-Type': 'application/json'
    },
    body: JSON.stringify(data)
});

Accord•2y ago

Was this issue resolved? If so, run /close - otherwise I will mark this as stale and this post will be archived until there is new activity.

James213•2y ago

Thanks, and I also forgot to add [FromBody] to my function's parameter, GetStockDataAsync([FromBody] Stock stock).

Accord•2y ago

Was this issue resolved? If so, run /close - otherwise I will mark this as stale and this post will be archived until there is new activity.

Gaming

Programming

❔ How to pass JS object to function.