Example of cascading drop down with multiselect checkbox in MVC

@model MvcApplication3.ViewModel.CSVM

@{
    ViewBag.Title = "Create";
}

<h2>Create</h2>

@using (Html.BeginForm()) {
    @Html.AntiForgeryToken()
    @Html.ValidationSummary(true)

    <fieldset>
        <legend>CSVM</legend>

        <div class="editor-label">
            @Html.LabelFor(model => model.CID)
        </div>
        <div class="editor-field">
            @Html.DropDownListFor(m => m.CID, new SelectList(Model.CDETAILS, "CID", "CNAME"), "Select", new {@style="width:180px" })
            @Html.ValidationMessageFor(model => model.CID)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.SIDDETAILS)
        </div>
        <div class="editor-field">
            <div id="dv">
                @Html.ListBoxFor(model => Model.SID, new MultiSelectList(Model.SDETAILS, "SID", "SNAME"))
            </div>
            @Html.ValidationMessageFor(model => model.SIDDETAILS)
        </div>

        <p>
            <input type="submit" value="Create" />
        </p>
    </fieldset>
}



@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
<script type="text/javascript">
    $(function () {
        $('#SID').multiselect();
        $('#CID').change(function ()
        {
            $.getJSON('@Url.Action("Gets")', { CID: $('#CID').val() }, function (data)
            {
                $('#dv').html("<select id='scid'></select>")
                $.each(data, function (i, j)
                {
                    $('#scid').append($('<option>').text(j.SNAME).attr("value", j.SID));
                });
                $('#scid').multiselect();
                $('#scid').multiselect("uncheckAll");
            });
         
        });
    });
    </script>
}