Leveraging a Javascript variable within a C# code block

Question

Leveraging a Javascript variable within a C# code block

I've been attempting to retrieve a variable using JavaScript and then use it in my C# block, but it seems like it's impossible.

Here is my HTML code:

<select class="form-control" id="Category">
    @foreach (var item in Model.Categori)
    {
        <option value="@item.CategoriId">@item.CategoriName</option>
    }
</select>
<div id="Container"></div>

And this is the JavaScript code I'm using:

$('#Category').on('change', function (e) {
   $("#Container").append(`@foreach (var item in Model.YetkinlikKategorileri.Where(x => x.Id == $('#Category').val()))
   {
       <p>hello</p>
   }`);
});

Is it possible to achieve something like this? If not, is there another way?

javascript c#asp.net-mvc

Answer 1

Answer №1

Here is a code snippet that demonstrates the necessary steps:

<script> 
var data = [
        @foreach (var item in dataList)
        {
            @Html.Raw("'"+item+"',")
        }
    ];
    $('#Category').on('change', function (e) {
        var lst = data.find(/*Your condition*/);
        for (var i = 0; i < lst.length; i++) {
            $("#Content").append("<p>hello</p>" + data[i] + "<br/>");
        }
    };
</script>

dataList represents the data received from the server.

This method involves retrieving all the data from the server and storing it in the javascript data array, then creating lst by searching within the data array.

However, using AJAX would be a more efficient approach compared to this razor code implementation.

Answer 2

Here is a code snippet that demonstrates the necessary steps:

<script> 
var data = [
        @foreach (var item in dataList)
        {
            @Html.Raw("'"+item+"',")
        }
    ];
    $('#Category').on('change', function (e) {
        var lst = data.find(/*Your condition*/);
        for (var i = 0; i < lst.length; i++) {
            $("#Content").append("<p>hello</p>" + data[i] + "<br/>");
        }
    };
</script>

dataList represents the data received from the server.

This method involves retrieving all the data from the server and storing it in the javascript data array, then creating lst by searching within the data array.

However, using AJAX would be a more efficient approach compared to this razor code implementation.

Leveraging a Javascript variable within a C# code block

Answer №1

Similar questions

The MVC website is displaying incorrectly on the IE11 browser when accessed from IIS, but it appears correctly when accessed from the .NET IDE

Creating a single Vuetify expansion panel: A step-by-step guide

Is there a way to effectively alter an object that has been assigned in a separate file?

Troubleshooting CSS Animation Failure in Internet Explorer 11

The page fails to redirect to the intended page when provided with an incorrect URL

Encountering an unexpected or invalid token in line 1 after reinstallation of Windows can be a frustrating experience

Encountered difficulty accessing the controller ActionResult from JavaScript代码

Tips for implementing a null check within the findAll() function

List Sorting with VueJS Drag and Drop功能

Issue with CSS: 200vw not scaling correctly for mobile devices

Error: material not being loaded by objloader

Awaiting the outcome of the Typescript map function is non-existent

Obtain the text content of a WebElement using the Selenium Driver in JavaScript

Empty results received from MongoDB queries executed within an asynchronous loop

"PHP and Javascript Validation Library: Building Confidence in Your Data

Designing the appearance of a table based on the information it holds

Resolving the 'Uncaught TypeError: number is not a function error' and tackling the 'Failed to load resource' issue

At what stage of the Angular JS application life cycle is this code being loaded?

"No location information is available" regardless of the input provided

Calculating the Bounding Box of SVG Group Elements