Как взять значение из выпадающего списка из Viewpage и передать его в контроллер в MVC

Question

Я создаю каскадный выпадающий список, один из которых - штат, а другой - город.Когда пользователь выбирает штат, я сохраняю этот идентификатор, а затем хочу заполнить названия городов, соответствующие этому штату.Я использовал ViewBag для заполнения State и хочу сделать то же самое для City, но не знаю, как передать идентификатор State со страницы View в Controller.Код моего контроллера:

public ActionResult ViewCitybyState(int? id)
        {
            List<string> a = null;

            if (id != null)
            {
                a = objmodel.ViewCitybyID(id).ToList();
            }
            ViewBag.Cities = a;
            return View(a);
        }

здесь идентификатор, который я хочу, имеет идентификатор состояния, который я должен получить, когда пользователь выбирает состояние, которое, как я знаю, нам нужно использовать команду onchange

My viewPage

@Html.DropDownListFor(m => m.States,new SelectList(ViewBag.State,"Stateid", "States"),new {@id="ddlstates", @onchange = "CallChangefunc(this.value)" })

Как передать значение в контроллер?

function CallChangefunc(val)
    {
       ?? // Not sure how and what to write here
    }
</script>

Answer 1

Первый

---

Изменить действие контроллера на:

public JsonResult ViewCitybyState(string id)

---

Второй

---

На странице просмотра создайте URL-адрес действия сервера и используйте $.getJSON примерно так:

// put your city dropdownlist into a variable
var cityDdl = $("#CityDropDownList");

// whatever variable you're storing the state value in
var stateIdValue = $("#StateDropDownList).val();

var submitUrl = '@Url.Action("ViewCitybyState", "ControllerName")';

$("#StateDropDownList").change(function() {
    $.getJSON(submitUrl,
        { id: stateIdValue },
        function (response) {
            console.log(response);
            cityDdl.empty();
            cityDdl.append($('<option></option>').val('').text('-- Select City --'));
            if (response.length !== 0) {
                $.each(response,
                    function(index, item) {
                        cityDdl.append($("<option></option>").val(item.Value).text(item.Text));
                    });
            }

        });
});

---

Третий

---

Отредактируйте действие вашего контроллера:

public ActionResult ViewCitybyState(string id)
{
    int ddValue;

    bool isNumber = int.TryParse(id, out ddValue);

    if(isNumber)
    {
        // _context is an assumption of what your connection string is
        // Cities is an assumption of the table you're using to hold the city names
        var cities = _context.Cities.Where(x => x.StateId == ddValue).Select(x => new { Text = x.CityName, Value = x.Id }).ToList();

        return Json(cities, JsonRequestBehavior.AllowGet);
    }
}

Дайте мне знать, если это поможет!

Answer 2

Есть много способов сделать это, если вы используете ajax, вы можете сделать это =>

function CallChangefunc(val)
    {
       $.ajax({
        url: http://localhost/Controller/ViewCitybyState,//Your route Here
        type: 'GET',
        data: { 
                id: val,                    
              },
        success: function () {
        },
        error: function () {                
        }
    });
    }