How to pass Json values from controller to view?

Question

I have a dropdownlist which is having id stakeHolderName01. i want to get the values in the dropdown when i click on button. for that i am writing code as below.as i am a learner , i got this code from some site. i am getting the values in controller i don't know how to pass values from controller to view . can anyone help me ? i am very new to MVC

This is my Javascript code to get the values from my controller

function DropDownLoad() {
        {
            alert("");
            $.ajax({
                url: '@Url.Action("Dropdown", "JointCompany")',
                type: "GET",
                success: function (jpoc) {
                    $("stakeHolderName01").append(jpoc.Values);
                }
            });
        }
    }

This is my controller and my class name jointcompanyviewmodel and the object for that is jpoc

 public JsonResult Dropdown(JointCompanyViewModel jpoc)
    {
        jpoc.DropDownValues();
        return Json(jpoc, JsonRequestBehavior.AllowGet);
    }

This is my model Jointcompanymodel, in this i am getting data from WCF services object name is Proxy. every thing is working fine here.

 public List<JointCompanyViewModel> DynamicDropDown()
    {
        var result = Proxy.GetJOCStakeHolder();
        List<JointCompanyViewModel> obj = new JavaScriptSerializer().Deserialize<List<JointCompanyViewModel>>(result);
        return obj;
    }

    public List<SelectListItem> Values { get; set; }

    public List<SelectListItem> DropDownValues()
    {
        var obj = DynamicDropDown();
        List<SelectListItem> lst = new List<SelectListItem>();
        foreach (var items in obj)
        {
            lst.Add(new SelectListItem { Text = items.Name, Value = items.ID });
        }
        Values = lst;
        return Values;
    }

Answer 1

I think this is what you want:

In your controller action you want to store the result of the method call jpoc.DropDownValues() into a variable and return that variable from the controller action:

public JsonResult Dropdown(JointCompanyViewModel jpoc)
    {
        var result = jpoc.DropDownValues();
        return Json(result, JsonRequestBehavior.AllowGet);
    }

Then on the client side your ajax call will receive the result of your controller action, which is a list of objects:

function DropDownLoad() {
        {
            alert("");
            $.ajax({
                url: '@Url.Action("Dropdown", "JointCompany")',
                type: "GET",
                success: function (jpoc) {
                    $("#stakeHolderName01").append(jpoc);
                }
            });
        }
    }

Bear in mind that you will need to call the javascript function DropDownLoad() to invoke your ajax call and have it retrieve the result of your controller action.

Also the current logic in the success callback of your ajax call is not enough to update your dropdown list. You then need to think about how you want to do this, this really depends on the type of drop down that your are using. If its something like <id="stakeHolderName01" select></select> then you can do this:

 var jpoc = [{ Text: "option 1", Value: 1 }, { Text: "option 2", Value: 2 }] // put this inside your success callback for (var i in jpoc) { var x = jpoc[i]; $('#stakeHolderName01').append('<option value="' + x.Value + '">' + x.Text + '</option>'); }

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <select id="stakeHolderName01"></select>