Loading DropDownList in MVC and Webservice

Model Class~~StdModel.cs

public class StdModel

    {

        public int Opt { get; set; }

        public int StdID { get; set; }

        [Required(ErrorMessage="Please Enter RollNo")]

        public string RollNo { get; set; }

        [Required(ErrorMessage = "Please Enter StudentName")]

        public String StudentName { get; set; }

       

        [Required(ErrorMessage = "Please Enter Religion")]

        public string Religion { get; set; }

        [Required(ErrorMessage = "Please Enter Age")]

        public int Age { get; set; }

        [Required(ErrorMessage = "Please Enter Class")]

        public string Class { get; set; }

        [Required(ErrorMessage = "Please Enter FatherName")]

        public string FatherName { get; set; }

        public List<GridStdModel> ListStdModel = new List<GridStdModel>();

    }

Controller~~StudentEntryController

        public JsonResult LoadDDL()

        {

            DataTable dt = new DataTable();

            StdModel Std = new StdModel();

            Std.Opt = 2;

            DBcode DB = new DBcode();

            dt=DB.Select(Std);

            List<StdModel> ListStdName = new List<StdModel>();

          

            StdModel StM = new StdModel();

              for(int i=0;i<dt.Rows.Count;i++)

              {

                  StM = new StdModel();

                  StM.StdID = Convert.ToInt32(dt.Rows[i]["StdID"]);

                  StM.StudentName = Convert.ToString(dt.Rows[i]["StudentName"]);

                 

                  ListStdName.Add(StM);

              }

              return Json(new SelectList(ListStdName,"StdID","StudentName"));

        }

View Page:

@model SMS.Models.StdModel

@{

    ViewBag.Title = "Student";

}

@Scripts.Render("~/bundles/jquery");

<script type="text/javascript">

    $(document).ready(function () {

        $("#ddl").empty();

        $("#ddl").append($("<option></option>").val("").html("Select  Group Name"));

        $.ajax({

            type: 'POST',

            url: '@Url.Action("LoadDDL","StudentEntry")',

            data: {},

            success: function (data) {

                $.each(data, function (i, data) {

                    $("#ddl").append('<option value="' + data.Value + '">' +

                         data.Text + '</option>');

                });

            },

            error: function (ex) {

                alert('Failed to retrieve.' + ex);

            }

        });

    });

</script>

<h2>Student Entry</h2>

@using (Html.BeginForm())

{

   

    @Html.ValidationSummary(true)

    <table border="1" width="100%" height="200px">

        <tr>

            <td align="center">

                @Html.DropDownListFor(m => m.StdID, Enumerable.Empty<SelectListItem>(), "ID", new {@id="ddl" })

            </td>

        </tr>

    </table>

}

Result: