Pass Dictionary<String,List<String>> to java script

Question

I would like to pass a Dictionary> to client using JavaScript.

I did look at this post and I didn't understand exactly how to proceed. In case I'm doing something wrong I'll explain what I want to do. The dictionary contains the 'name' key of all worksheets in the Excel file, and the 'value' is the column value of the first row in that worksheet. The UI of the client should have two "drop list", the first will contain the key which is all the names of the worksheet in the Excel file. The second contain all the column value of the first row of the worksheets that will choose in the first drop list – which is actually a List as the value in the dictionary.

So all the back end C# code is working fine. Now I need help in the front end JavaScript.

How do I parse the data to a key value so I can do a "search" on the keys as the client chooses some "key" in the first drop list so I can get back the relevant values as a list?

Thanx!

   var ajaxRequest = $.ajax({
        type: "POST",
        url: "http://localhost:1894/api/Values",
        contentType: false,
        processData: false,
        data: data,
        success: function(dataTest) {

        }
    });

This is the JSON that I get back from the server:

{"First":["Name","Link","User","Pass"],"Sec":["test01"]}

How would I perform a search on this like in C#? I want to be able to do something like this: "dict.TryGetValue(key, out value); and the out value would return as an array of string or as a List.

I'm not sure. In the web api controller i just do a "return" with no special attribute or something. How do i check if it is a JSON? — user384496
– user384496, Commented Apr 23, 2015 at 17:25
Call the service in your browser and look at the returned response. Just enter http://localhost:1894/api/Values in your browser and see what the response is... — brso05
– brso05, Commented Apr 23, 2015 at 17:27
This is the result: "<ArrayOfstring xmlns:i="w3.org/2001/XMLSchema-instance" xmlns="schemas.microsoft.com/2003/10/Serialization/Arrays"> <string>value1</string> <string>value2</string> </ArrayOfstring>" — user384496
– user384496, Commented Apr 23, 2015 at 17:29
Looks like xml...you can parse xml using javascript but it would be easier if it was returned as JSON then javascript would automatically parse and generate the object for you. — brso05
– brso05, Commented Apr 23, 2015 at 17:47

brso05 · Accepted Answer · 2015-04-23 19:26:37Z

0

Try this(you don't need var ajaxRequest variable you can directly call like this:

 $.ajax({
    type: "POST",
    url: "http://localhost:1894/api/Values",
    dataType: "json",
    data: data,
    success: function(dataTest) {
        //dataTest should contain your data in a javascript object
        for(var i = 0; i < dataTest.First.length; i++)
        {
            window.alert("" + dataTest.First[i]);
        }
        for(var i = 0; i < dataTest.Sec.length; i++)
        {
            window.alert("" + dataTest.Sec[i]);
        }
        //etc...
        //this should print the values returned if you showed me exactly how your JSON is...
    }
 });

The javascript object will contain properties with an array as the value for each property. Think of it like a map of <String, String[]>. So your returned object dataTest will have properties First and Sec and for First the value associated with the key First will be ["Name","Link","User","Pass"] which is just an array. Same for Sec. So `dataTest.First[0] will equal "Name" and dataTest.First[1] will equal "Link" etc...

*****************************************UPDATE**************************************

You can save your dataTest to a global variable in this example (myObject) then you can access like this:

var key = "First";
// Or if you want to get your key from a dropdown (select) element then you could do like this:
var key = document.getElementById("myselect").options[document.getElementById("myselect").selectedIndex].innerHTML;

if(myObject[key] != undefined)
{
    //That means there is values for this key.
    //Loop through values or do whatever you want with myObject[key].
    for(var i = 0; i < myObject[key].length; i++)
    {
        window.alert("" + myObject[key][i]);
    }
}

edited Apr 23, 2015 at 19:26

answered Apr 23, 2015 at 18:08

brso05

13.3k2 gold badges25 silver badges41 bronze badges

Sign up to request clarification or add additional context in comments.

14 Comments

user384496 Over a year ago

I dont understend what is the diffrence.

brso05 Over a year ago

@user384496 i just updated the answer you should see the results pop-up in a dialog box...

brso05 Over a year ago

@user384496 this should work if your returned JSON actually matches what you posted.

brso05 Over a year ago

@user384496 i just updated you should set dataType: "json" to json and you don't need data: data, unless you are passing parameters to the service and in that case your data object will be an object of key, value pairs the parameters you are passing...

brso05 Over a year ago

@user384496 post your full JSON so I can see what you are dealing with...it's hard to know what the javascript object is going to contain without seeing the json...

|

Collectives™ on Stack Overflow

Pass Dictionary<String,List<String>> to java script

1 Answer 1

14 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

14 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related