Click here to Skip to main content
15,918,268 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more: , +
(After making changes based on this question I made yesterday)

My goal is to dynamically update two fields every time there's a change made to a dropdown list. In my example, the dropdown is a list of employees, and I need the group/subgroup fields to update every time it changes. I'm attempting to call the C# method I've created which runs 2 linq queries and sets the result to the fields. I've verified that this method works properly.

I now have the following method in my file "Edit.html.cs":
// Updates chosen specialist's group and subgroup
public GroupModel Group { get; set; }
public class GroupModel
    public string subGroup { get; set; }
    public string group { get; set; }
public ActionResult OnPostSearchCurrGroup()
    var subgroupQuery = (from c in _context.ppcc_matrix
                         from e in _context.employees
                         from s in _context.subGroups
                         where c.employeesID == e.Id
                         where e.subGroupsID == s.Id
                         select s.subgrp_nm).FirstOrDefault();
    //subGroups.subgrp_nm = subgroupQuery;

    var groupQuery = (from c in _context.ppcc_matrix
                      from e in _context.employees
                      from s in _context.subGroups
                      from g in _context.groups
                      where c.employeesID == e.Id
                      where e.subGroupsID == s.Id
                      where s.groupsID == g.Id
                      select g.grp_nm).FirstOrDefault();
    //groups.grp_nm = groupQuery;

    var result = new GroupModel { subGroup = subgroupQuery, group = groupQuery };
    return new JsonResult(result);

I have these three fields in "Edit.cshtml":
<div class="form-group">
    <label asp-for="ppcc_matrix.employeesID" class="control-label"></label>
    <select asp-for="ppcc_matrix.employeesID" class="form-control" id="employee" asp-items="ViewBag.employeesID">
        <option disabled selected value="0" style="display:none">--select--</option>
<div class="form-group">
    <label asp-for="" id="grptxt">Group</label>
    <input asp-for="" id="grpnm" class="form-control" disabled />
<div class="form-group">
    <label asp-for="Group.subGroup" id="subgrptxt">SubGroup</label>
    <input asp-for="Group.subGroup" id="subgrpnm" class="form-control" disabled />

Using the three id's I've assigned to them, I run this javascript and ajax request in the same file:
@* Dynamically updates the view to show chosen specialist's group and subgroup*@
<script language="javascript" type="text/javascript">
    var employee = document.getElementById('employee');
    employee.addEventListener('change', UpdateGroup);
    function UpdateGroup() {
            type: 'post',
            url: '/edit?handler=searchcurrgroup',
            contenttype: "application/json; charset=utf-8",
            datatype: 'json',
            data: '{}',
            async: 'true',
            success: function (data) {
                OnSuccessed(data.subGroup) {
                OnSuccessed( {

Still, nothing happens and I receive no errors.

What I have tried:

Multiple articles, submitted as a comment on my similar previous question as well.
This article has been helpful, but figuring out how to display the results is confusing to me.
Updated 1-May-19 11:05am
Dominic Burford 1-May-19 11:02am    
At what point does the AJAX request fail? Are you hitting the Razor page handler? Are you hitting the AJAX success method? What response does your AJAX request get from the page handler?

1 solution

Do you know how to use Chrome debugging tools? You should use them to watch this code, see what the request returns and see what happens when it succeeds.

Your code looks to me like it defines two functions in your success method, it doesn't actually call anything? What is OnSuccessed?

As you're using jquery, you should use jquery to set your elements. But overall, I'd recommend drifting away from 2004 and looking into using React or Angular, or even Handlebars, to template your UI rather than looking up the DOM all the time
Share this answer

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

  Print Answers RSS
Top Experts
Last 24hrsThis month

CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900