Filtering table data on drop down list change in ASP.NET MVC

I am new in JQuery Ajax. I am not sure how to rebind data table when drop down selection changed. Can I bind on same view? Also partial rendering I tried, which I am not clear understanding, not working. Please advise if you have any or if you have any sample code would be highly appreciated.

Brief of bellow code:
-------------------
I bind drop down and view in Index() method. DDL is getting from enum class model and I build a dll Business that supplies List<person> that I bind on table data. I tried rebinding on UpdateIndex(). I am able to pass ddl selection through parameter "race" but linq is not working.

Controller Code:
===============
public ActionResult Index()
{
List<SelectListItem> selectListItem = new List<SelectListItem>();
DropDownModel dropDownModel = new DropDownModel();

dropDownModel.id = (int)enumRace.eRace.Angles;
dropDownModel.Value = enumRace.eRace.Angles.ToString();

selectListItem.Add(new SelectListItem() { Value = dropDownModel.Value, Text = dropDownModel.id.ToString() });

dropDownModel.id = (int)enumRace.eRace.Saxons;
dropDownModel.Value = enumRace.eRace.Saxons.ToString();

selectListItem.Add(new SelectListItem() { Value = dropDownModel.Value, Text = dropDownModel.id.ToString() });

dropDownModel.id = (int)enumRace.eRace.Jutes;
dropDownModel.Value = enumRace.eRace.Jutes.ToString();

selectListItem.Add(new SelectListItem() { Value = dropDownModel.Value, Text = dropDownModel.id.ToString() });

dropDownModel.id = (int)enumRace.eRace.Asians;
dropDownModel.Value = enumRace.eRace.Asians.ToString();

selectListItem.Add(new SelectListItem() { Value = dropDownModel.Value, Text = dropDownModel.id.ToString() });

ViewBag.DropDownList = new SelectList(selectListItem, "Text", "Value");

RaceModel rcModel = new RaceModel();
List<businessobject.person> people = rcModel.personCollection;

ViewBag.Peoples = people.Where(a => a.Age % 2 == 0).OrderBy(o => o.Age).ToList();

return View();
}

public ActionResult UpdateIndex(string race)
{
RaceModel rcModel = new RaceModel();
ViewBag.Peoples = null;
List<businessobject.person> people = rcModel.personCollection;
ViewBag.Peoples = people.Where(a => a.Age.ToString() == race).ToList();
return View("Race");

}

}


==================================================

View Code:
===========

@model RaceDB.Models.RaceModel

@{
ViewBag.Title = "Index";
}
<script src="~/Scripts/jquery-1.5.1.min.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js", type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#RaceDropDownList").change(function () {
$.ajax({
url: "/Race/UpdateIndex",
type: 'POST',
data: { race: $(this).val() },
datatype: 'json',
success: function (data) {
var elements = "";
$.each(data, function () {
elements = elements + '<option values="' + this.id + '">' + this.state + '</option>'
})
$('#State').empty().attr('disabled', false).append(elements);
}
});
});
});
</script>

Index

Race Details

@foreach (var p in (ViewBag.Peoples as List<businessobject.person>))
{
}

Name	Age	Height
@p.Name	@p.Age	@p.Height	@p.Race	@p.plusOneYearAge