i'm having trouble while choose each category, it can't show book of each category. My index code here

@using (Html.BeginForm("Index", "BorrowBook", FormMethod.Post, new { name = "demoForm" }))
        {
            @Html.DropDownList("id_category", (IEnumerable<SelectListItem>)ViewBag.listTest, "-- Select Category --",
                 new { onchange = "SelectedIndexChanged()" })
<div> Show list of book in the middle </div>
}

And my controller like that

// GET: BorrowBook
        public ActionResult Index(string mess)
        {
            var query = context.categories.Select(c => new { c.id_category, c.name });
            var userInfomatiom = (LibraryAsp.Models.User)Session["USER"];
            if (userInfomatiom.Role.id_role == 1)
            {
                ViewBag.listP = publisherDao.getAll();
                ViewBag.listC = categoryDao.getAll();
                ViewBag.list = bookDao.getAll();
                ViewBag.listTest = new SelectList(query.AsEnumerable(), "id_category", "name");
                ViewBag.mes = mess;
                return View();
            }
            else
            {
                return RedirectToAction("Error", "Home");
            }
         }

        [HttpPost]
        public ActionResult Index (Category category)
        {
            ViewBag.listP = publisherDao.getAll();
            ViewBag.listC = categoryDao.getAll();
            ViewBag.list = context.books.Where(p => p.id_category == category.id_category).ToList();
            return View();
        }

When debugging, i found that id category, form, or value is loaded like this But when i choose each category, i get bug like that: I think my java script is having problem. But i can't figure out this. Any body can help me, many thanks.