Displaying AJAX data on success not working

Question

Upon success, my data isn't displaying, the JavaScript alert pop up is blank. I was wondering if you could help. This is within an MVC C# context where I run function GradeCalc with grade parameter.

$("#test").on("change", function () {
        var gradeval = $("#Grade").val();   
            $.ajax
                ({
                    url: '/Grade/GradeCalc/',
                    contentType: 'application/json',
                    type: 'POST',
                    data: JSON.stringify({ grade: gradeval }),
                    dataType: 'JSON',   
                    success: function (data) {
                        alert(data);
                     },
                    error: function (xhr) {
                        alert('Request Status: ' + xhr.status + ' Status Text: ' + xhr.statusText + ' ' + xhr.responseText);
                    },
                });
        });

The C# return code is:

public JsonResult GradeCalc(string grade)
{
    //calculations etc are performed here........then
    return Json(ViewBag.Grades, JsonRequestBehavior.AllowGet);
}

Answer 1

Hi sup you can try console.log(data); then you see in browser console that you should have used alert(data.data); or what ever your actuall data are wrapped around alert(data.wrapperclass)