passing arraylist from MVC razor View to javascript

Question

0.00/5 (No votes)

See more:

Javascript

MVC

I have list in MVC view and i need to pass this to javascript function, can someone help me out !!!

Thanks

Posted 2-Oct-12 19:53pm

Anoop Jasiwal

Updated 9-Jan-17 21:03pm

Add a Solution

5 solutions

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

mr.priyank · Answer 1 · 2012-10-03T02:01:00

in Java Script Write this

C#

function GetList()
{
var siteRoute= $("#hdsiteroute").val() ;// in cshtml or aspx have a hidden field with this id and value as Url.Content("~") this will help in live mode
var url=siteRoute+"YourController/GetList"



 $.ajax({ url: url, data: {yourargument:1}, type: "GET", dataType: "json", async: false, cache: false, error: ajaxError, success: function (result) {
  for (var i = 0; i < result.length; i++) {
        alert(result[0]); // access each item like this. if list is of any complex type the use result[0].Name // say name is a proprty of the complex type
    }

 } });

}
function ajaxError(jqXHR, textStatus, errorThrown) {
   // CATCH ERROR HERE
}

and in controller have

XML

public ActionResult GetList(int yourargument)
       {
           List<int> MyList = new List<int>(); //LIST CAN BE OF ANY COMPLEX DATATYPE
           MyList.Add(1);
           return Json(MyList, JsonRequestBehavior.AllowGet);
       }

ErwanLent · Answer 2 · 2014-04-15T07:59:00

Solution 4

One liner:

C#

var data = [@Html.Raw(String.Join(",", Model.MyArray.Select(i => "'" + i + "'")))];

Posted 15-Apr-14 7:59am

ErwanLent

Comments

ChessGirl 10-Jul-15 5:30am

This worked for me! As a newbie, I had to figure out that it went between script tags and I could use it to pick up an array that I'd passed through the ViewBag:

@{int[] graphNumbers = ViewBag.GraphNumbers;}
<script type="text/javascript">
var graphNumbers = [@Html.Raw(String.Join(",", graphNumbers.Select(i => "'" + i + "'")))];
</script>
This passed the array through perfectly, and my Chart.js graph now works!

Thanks very much!

**Zoltán Zörgő** · Answer 3 · 2012-10-02T20:06:00

Solution 1

You can pass any data from the controller to the view via the viewbag. Simply add a filed to the viewbag and pass the json encoded list to it. In the view use a script tag on the top of it to assign it's value to a javascript variable. There you have it :)

Posted 2-Oct-12 20:06pm

Zoltán Zörgő

Anoop Jasiwal · Answer 4 · 2012-10-03T01:12:00

Solution 2

Thanks for the reply, to adding to the question, i am not supposed to use Viewbag or Tempdata and moreover it is not array list it is "ToList<componentobservationtype>"
how do i get this listcollection into javascript function

Posted 3-Oct-12 1:12am

Anoop Jasiwal

Comments

Zoltán Zörgő 3-Oct-12 15:19pm

This is not a solution, it is a comment to my answer. Please use the proper tools.
But:
1) why can't you use viewbag or tempdata?
2) there is no such thing in JavaScript as list. There are only arrays and objects - thus your list will be array or object in javascript, but that's indifferent in your case
3) you either render your page with the data in it, as I suggested before, or you use ajax to get it from the server on runtime. In the later case you will not use viewbag or tempdata, but hat is an other scenario. Is it this what's interesting you? In that case mr.priyank's answer is your path to take.

new_steven · Answer 5 · 2017-01-09T21:03:00

Solution 5

cshtml:

var listData = JSON.parse('@Html.Raw(HttpUtility.HtmlDecode(ViewBag.ListData))');

cs:

ViewBag.ListData= JsonConvert.SerializeObject(new List<string>() { "ABC", "EFG" });

Posted 9-Jan-17 21:03pm

new_steven