Geek asks and answers

How to get through the dictionary that is returned from the JsonResult method?

I have a JavaScript method that calls an AJAX call to a controller method. This controller method is a JsonResult method that returns the dictionary object back to my JavaScript. But everything I do with this object (for example, dictionaryObject.count, dictionaryObejct [i] .value, etc.) gives me "undefined". Any idea on how I should use this object?

function MakeControllerMethodCallFunction(stringParam1, stringParam2) {
    // Remove all rows from table so that table can have latest data
    $('#TableModal tr').each(function (i, row) {
        var $row = $(row);

        $row.remove();
    });

    $("#TableModal thead").append("<tr><th>" + stringParam1+ " Details " + "</th></tr>");

    //Resolving the server side method URL
    var websitePath = GetRootWebSitePath();
    var getUrl = websitePath + "/Home/GetDetails";

    //Creating parameters for Ajax call
    var params = "{\"ParamOne\" : \"" + stringParam1+ "\" , \"ParamTwo\" : \"" + stringParam2+ "\" }";

    //AJAX Call
    $.ajax({
        url: getUrl,
        type: 'POST',
        dataType: 'json',
        contentType: 'application/json; charset=utf-8',
        data: params,
        success: MakeControllerMethodCallFunction_Success,
        error: function (xhr, status, thrownError) {
            alert("Get Details error");
        }
    });
}

//On Success of MakeControllerMethodCallFunction() this will be hit and values will be bind to the table
function MakeControllerMethodCallFunction_Success(dictionaryObject) {
    var Size = 0;
    if (dictionaryObject!= null) {

        Size = (dictionaryObject!= null) ? dictionaryObject.count : 0;
    }

    if (Size != null) {

        for (var i = 0; i < Size; i++) {

            var newRow = "<tr>";

            if (dictionaryObject!= null && dictionaryObject.count> 0 && dictionaryObject[i] != null) {
                newRow += "<td>" + dictionaryObject[i].name + "</td>" + "<td>" + dictionaryObject[i].value + "</td>";

            }
            else {
                newRow += "<td></td>";
            }
            newRow += "</tr>";
            $("#TableModal tbody").append(newRow);
        }
    }
}
+3
source share
1 answer

Assuming you returned Dictionary<string, string>from your controller action:

public ActionResult GetDetails()
{
    var result = new Dictionary<string, string>
    {
        { "key1", "value1" },
        { "key2", "value2" },
        { "key3", "value3" },
    };

    return Json(result, JsonRequestBehavior.AllowGet);
}

which will cause the following JSON to be sent over the cable:

{"key1":"value1","key2":"value2","key3":"value3"}

, javascript Array, , . javascript .

AJAX:

function MakeControllerMethodCallFunction_Success(dictionaryObject) {
    for (var key in dictionaryObject) {
        if (dictionaryObject.hasOwnProperty(key)) {
            var value = dictionaryObject[key];
            alert(key + " -> " + value);
        }
    }
}

, Dictionary<string, SomeModel>, javascript: value.SomeProperty.

+7

More articles:


All Articles