Set jsTree TreeView CheckBox checked based on DropDownList selection in ASP.Net Core MVC

Hi pshresthaa08,

Check this example. Now please take its reference and correct your code.

Model

public class VehicleType
{
    public int Id { get; set; }
    public string Name { get; set; }
}

public class VehicleSubType
{
    public int Id { get; set; }
    public string Name { get; set; }
    public int VehicleTypeId { get; set; }
}

public class VehicleLevelType
{
    public int Id { get; set; }
    public string Name { get; set; }
    public int VehicleTypeId { get; set; }
    public int VehicleSubTypeId { get; set; }
}

public class TreeViewNode
{
    public string id { get; set; }
    public string parent { get; set; }
    public string text { get; set; }
}

Controller

public class HomeController : Controller
{
    public IActionResult Index()
    {
        List<TreeViewNode> nodes = new List<TreeViewNode>();
        foreach (VehicleType type in GetVehicleTypes())
        {
            nodes.Add(new TreeViewNode
            {
                id = type.Id.ToString(),
                parent = "#",
                text = type.Name
            });
        }
        foreach (VehicleSubType subType in GetVehicleSubTypes())
        {
            nodes.Add(new TreeViewNode
            {
                id = subType.VehicleTypeId.ToString() + "-" + subType.Id.ToString(),
                parent = subType.VehicleTypeId.ToString(),
                text = subType.Name
            });
        }

        int i = 0;
        foreach (VehicleLevelType levelType in GetVehicleLevelTypes())
        {
            nodes.Add(new TreeViewNode
            {
                id = levelType.VehicleSubTypeId.ToString() + "-" + levelType.VehicleTypeId.ToString() + "-" + levelType.Id.ToString(),
                parent = levelType.VehicleTypeId.ToString() + "-" + levelType.VehicleSubTypeId.ToString(),
                text = levelType.Name
            });
        }

        ViewBag.Json = JsonConvert.SerializeObject(nodes);
        return View();
    }

    [HttpPost]
    public IActionResult Index(string selectedItems)
    {
        List<TreeViewNode> items = JsonConvert.DeserializeObject<List<TreeViewNode>>(selectedItems);
        return RedirectToAction("Index");
    }

    private List<VehicleType> GetVehicleTypes()
    {
        List<VehicleType> vehicleTypes = new List<VehicleType>();
        string conString = "Server=.\\SQL2014;DataBase=AjaxSamples;UID=sa;PWD=pass@123";
        string query = "SELECT Id,Name FROM VehicleType";
        using (SqlConnection con = new SqlConnection(conString))
        {
            SqlCommand cmd = new SqlCommand(query);
            cmd.Connection = con;
            con.Open();
            SqlDataReader sdr = cmd.ExecuteReader();
            while (sdr.Read())
            {
                vehicleTypes.Add(new VehicleType
                {
                    Id = Convert.ToInt32(sdr["Id"]),
                    Name = sdr["Name"].ToString()
                });
            }
            con.Close();
        }
        return vehicleTypes;
    }

    private List<VehicleSubType> GetVehicleSubTypes()
    {
        List<VehicleSubType> vehicleSubTypes = new List<VehicleSubType>();
        string conString = "Server=.\\SQL2014;DataBase=AjaxSamples;UID=sa;PWD=pass@123";
        string query = "SELECT Id,Name,VehicleTypeId FROM VehicleSubType";
        using (SqlConnection con = new SqlConnection(conString))
        {
            SqlCommand cmd = new SqlCommand(query);
            cmd.Connection = con;
            con.Open();
            SqlDataReader sdr = cmd.ExecuteReader();
            while (sdr.Read())
            {
                vehicleSubTypes.Add(new VehicleSubType
                {
                    Id = Convert.ToInt32(sdr["Id"]),
                    Name = sdr["Name"].ToString(),
                    VehicleTypeId = Convert.ToInt32(sdr["VehicleTypeId"])
                });
            }
            con.Close();
        }
        return vehicleSubTypes;
    }

    private List<VehicleLevelType> GetVehicleLevelTypes()
    {
        List<VehicleLevelType> vehicleLevelTypes = new List<VehicleLevelType>();
        string conString = "Server=.\\SQL2014;DataBase=AjaxSamples;UID=sa;PWD=pass@123";
        string query = "SELECT Id,Name,VehicleTypeId,VehicleSubTypeId FROM VehicleLevelType";
        using (SqlConnection con = new SqlConnection(conString))
        {
            SqlCommand cmd = new SqlCommand(query);
            cmd.Connection = con;
            con.Open();
            SqlDataReader sdr = cmd.ExecuteReader();
            while (sdr.Read())
            {
                vehicleLevelTypes.Add(new VehicleLevelType
                {
                    Id = Convert.ToInt32(sdr["Id"]),
                    Name = sdr["Name"].ToString(),
                    VehicleTypeId = Convert.ToInt32(sdr["VehicleTypeId"]),
                    VehicleSubTypeId = Convert.ToInt32(sdr["VehicleSubTypeId"])
                });
            }
            con.Close();
        }
        return vehicleLevelTypes;
    }
}

View

@addTagHelper*, Microsoft.AspNetCore.Mvc.TagHelpers
@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
</head>
<body>
    <select id="ddlUsers" name="branch">
        <option value="0">Select</option>
        <option value="1">Bus</option>
        <option value="2">Car</option>
        <option value="3">Truck</option>
    </select>
    <div id="jstree">
    </div>
    <form method="post" asp-controller="Home" asp-action="Index">
        <input type="hidden" name="selectedItems" id="selectedItems" />
        <input type="submit" value="Submit" />
    </form>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/themes/default/style.min.css" />
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.1/jquery.min.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/jstree.min.js"></script>
    <script type="text/javascript">
        $(function () {
            $('#ddlUsers').on('change', function () {
                $('#jstree').jstree("deselect_all");
                $("#jstree").jstree("check_node", $("a:contains(" + $(this).find('option:selected').text() + ")"));
            });

            $('#jstree').on('changed.jstree', function (e, data) {
                var i, j;
                var selectedItems = [];
                for(i = 0, j = data.selected.length; i < j; i++) {
                    var id = data.selected[i];
                    if(id.indexOf('-') != -1){
                        id = id.split("-")[1];
                    }
                    selectedItems.push({
                        text: data.instance.get_node(data.selected[i]).text,
                        id: id,
                        parent: data.node.parents[0]
                    });
                }
                $('#selectedItems').val(JSON.stringify(selectedItems));
            }).jstree({
                "core": {
                    "themes": {
                        "variant": "large"
                    },
                    "data": @Html.Raw(ViewBag.Json)
                    },
                "checkbox": {
                    "keep_selected_style": false
                },
                "plugins": ["wholerow", "checkbox"],
            });
        });
    </script>
</body>
</html>

Screenshot