CODEWITHSUNDEEP
jqueryasp.net-core.net-corecascade
Haminteu
Haminteu

Reputation: 1334

Cascade Dropdown NET CORE

I am lil bit headache, because I don't know where is the problem. I have the following controller:

public JsonResult GetActivitySubType(int typeId)
{
    var data = (from a in _db.ActivitySubTypes
                where a.ActivityTypeId == typeId
                select new
                {
                    a.ActivitySubTypeId, a.ActivitySubTypeName
                    }
            ).ToList();
    return Json(data);
}

public IActionResult Index()
{
    ViewData["ActivityTypeId"] = new SelectList(_db.ActivityTypes.OrderBy(o => o.ActivityTypeName), "ActivityTypeId", "ActivityTypeCode");
    return View();
}

Then on my View. I have the following code:

<select asp-for="ActivityTypeId" asp-items="ViewBag.ActivityTypeId"><option value="">Select</option></select>
<select id="ActivitySubTypeId" asp-for="ActivitySubTypeId"></select>

<script type="text/javascript">
    $(document).ready(function () {
        $("#ActivityTypeId").change(function () {
            $.get("GetActivitySubType", { typeId: $("#ActivityTypeId").val() }, function (data) {
                $("#ActivitySubTypeId").empty();
                $.each(data, function (index, row) {
                    $("#ActivitySubTypeId").append("<option value='" + row.ActivitySubTypeId + "'>" + row.ActivitySubTypeName + "</option>")
                });
            });
        })
    });
</script>

When I select the ActivityType, it loaded undefined on my select ActivitySubType. Am I missed something?

Thanks a lot.

Upvotes: 0

Views: 40

Answers (1)

Rena
Rena

Reputation: 36625

The naming convention for response in asp.net core is camel case instead of pascal case.

Change like below:

$("#ActivitySubTypeId").append("<option value='" + row.activitySubTypeId + "'>" + row.activitySubTypeName + "</option>")

Upvotes: 2

Related Questions