ASP.NET MVC 5 － Adding a Search

᳓前言

本篇文章將"Adding a Search Method and Search View"整理而成。

᳓重點整理

• 可直接在URL輸入參數便可作為字串進行標題的搜尋。
• 在View加入TextBox，可輸入文字並進行標題的搜尋。
• 在View加入DropDownList，可選擇類型並進行類型的搜尋。

᳓實作1. 修改Controllers/MoviesController.cs 
在Index Action新增searchString參數(當然也可以修改為直接利用URL Route的方式搜尋，請參考"ASP.NET MVC 5 － Adding a Controller")，並加入LINQ query程式碼。值得注意的是，LINQ query在初被定義時還沒執行，要等到Index Action回傳結果至View時才會執行。

1. 在網址列輸入"http://{localhost:port}/Movies/Index?searchString={searchString}"，按下Enter重新載入頁面即會顯示影片標題內含所搜尋字串的影片。

᳓實作2. 修改Views/Movies/Index.cshtml
然而經由修改URL的方式搜尋太不直覺，因此要在Index.cshtml頁面直接加入UI，提供輸入欄位以及控制按鈕，方便使用。

1. 一進入頁面就可以看到"BeginForm()"被編譯成<form>，其下含"TextBox()"被編譯成<input type="text">，以及<input type="submit">。(此時可直接利用UI進行搜尋，不需要添加與修改URL中的參數，Controller在執行時會自動取用對應id的元件值，若是將@Html.TextBox("searchString")改為@Html.TextBox("searchStrings")便會無法進行搜尋)

᳓實作3. 修改Views/Movies/Index.cshtml
光只是加入UI仍然沒有提供好的使用體驗，因為當使用者想要將搜尋結果分享給其他人的時候卻發現複製到的URL中並沒有附帶參數，不能夠直接顯示出搜尋的結果，所以要再進行一點修正，使用BeginForm("{Action Name}", "{Controller Name}", FormMethod.Get)。

1. 按下搜尋按鈕後，URL會自動添加"?searchString={searchString}"，因此該網址可直接複製至新頁面使用。

᳓實作4. 修改Controllers/MoviesController.cs、Views/Movies/Index.cshtml
接著練習加入下拉式選單至頁面中。利用LINQ query搜尋資料表中所有的類型，接著以Distinct()將重複的選項剔除後加入至List，最後將List的資料用ViewBag.SelectList({Collection.IEnumerable items}, "{Selected Value}")代入至View並顯示。

1. 一進入頁面就可以看到"DropDownList()"被編譯成<select>，除了資料庫中的類型外還增加了"全部"的選項，且預設選取"愛情片"。