How do I create a simple seach box with a submit button to bring back a result set in MVC?

Posted by RJ on Stack Overflow See other posts from Stack Overflow or by RJ
Published on 2010-05-17T23:21:02Z Indexed on 2010/05/17 23:30 UTC
Read the original article Hit count: 272

Filed under:
|
|
|
|

I am very new to MVC and just learning the basics. I have been following along in Nerd Dinner and used the demo as a way to create my own app. I have created a page that lists out some food items with calories, fat, protein,etc... (http://rjsfitness.net/CalorieList) This is one of my own personal sites that I set up to test out MVC. I got a lot of it working but I am stuck on the textbox with a search button.

My view page has this code for the search:

    <form action="/CalorieList/Search" method="post" id="searchForm">
  <input type="text" name="searchTerm" id="searchTerm" value="" size="10" maxlength ="30" />
  <input type ="submit" value="Search" />
</form>

My global.asax has this code for the routing:

        routes.MapRoute(
            "Search", // Route name
            "CalorieList/Search/{searchTerm}", // URL with parameters
            new { controller = "CalorieList", action = "Search", search = "" } // Parameter defaults
        );

My Controller has this code:

        public ActionResult Index(int? page)
    {
        const int pageSize = 10;

        //load a list with the calorie list
        var calorieLists = calorieListRepository.GetAllCalorieLists();

        //var paginatedCalorieLists = calorieLists.Skip((page ?? 0) * pageSize).Take(pageSize).ToList();
        var paginatedCalorieLists = new PaginatedList<CalorieList>(calorieLists, page ?? 0, pageSize);

        return View("Index", paginatedCalorieLists);
    }

    public ActionResult Search(String searchTerm)
    {
        const int pageSize = 100;
        int? page = 0;

        var calorieLists = calorieListRepository.GetCalorieListsBySearch(searchTerm);

        var paginatedCalorieLists = new PaginatedList<CalorieList>(calorieLists, page ?? 0, pageSize);

        return View("Index", paginatedCalorieLists);
    }

        return View("Index", paginatedCalorieLists);
    }

When I enter a value and click the button, the Index method fires instead of the Seach method in the controller and I get the full list again. If I manually type the url (http://rjsfitness.net/CalorieList/Search/choc) I get the right listing.

Why isn't my button click using the right routing and giving me the search results?

© Stack Overflow or respective owner

Related posts about asp.net-mvc

Related posts about c#