在javascript中更改时,下拉列表值为空

嗨,我的HTML代码中有这个DDL,如您所见:

<select class="form-control" name="RoleId" id="RoleId">
                                                <option value="1">User</option>
                                                <option value="2">Admin</option>
                                                <option value="3">Security</option>

                                        </select>

我用以下代码调用我的JSON操作控制器:

<script type="text/javascript">
    $(document).ready(function () {
        //Dropdownlist Selectedchange event
        $("#RoleId").change(function () {
            $.ajax({
                type: 'POST',
                url: '@Url.Action("GetRolePolicy", "RolePolicy", new { area= "Admin" })',
                dataType: 'json',
                data: { RoleName: $("#RoleId").val() },
                success: function (data) {


                    var cusid_ele = document.getElementsByClassName('toggle');

我需要组合框中所选项目的值,但这行代码

rolename:$(“roleid”).val(),

在控制器中的操作返回空值。为什么?

                    public JsonResult GetRolePolicy(string RoleId)
        {
            int RoleIdConverted = int.Parse(RoleId);
            RolePolicy _RolePolocy = new RolePolicy();
}