How to get to certain items in a list in a razor model

Question

In the view in Razor, I pass in a model that contains a list ('usageList') of objects that have the Name property and UseDescription.

In jQuery, I created a slider, and I want a specific UseDescription to appear when the slider value changes.

The problem is getting a specific object in the list inside the model. I have this code (jQuery):

<script type="text/javascript"> $(document).ready(function() { $("#slider").slider({ min:1, max:3, value:1, range:"min", change: function(event,ui){ var number = ui.value; alert("@Model.UsageList[ui.value].UseDescription"); } }); }); </script> 

impossible to get ui.value on this line:

 alert("@Model.UsageList[ui.value].UseDescription"); 

If I pass a number (1 for expample) instead of ui.value, everything will work fine. But I need to get a specific list.

Any help is greatly appreciated.

Answer 1

You need to upload your client side list using javascript. Then you can get the item by index. Something like that:

 <script type="text/javascript"> $(document).ready(function() { var usageList = [] @foreach (var item in Model.UsageList) { <text>usageList.push('@item.UseDescription');</text> } } $("#slider").slider({ min:1, max:3, value:1, range:"min", change: function(event,ui){ var number = ui.value; alert(usageList[ui.value - 1]); } }); }); </script>