ASP.NET WP - Add Search



In this chapter, we will be covering how to add search functionality in your website using the Microsoft Bing search engine. Adding a search functionality to your website is very easy, you can use the Bing helper and specify the URL of the site to search. The Bing helper renders a text box where users can enter a search term.

By adding the capability to search, you can also include Internet search results without leaving your site. You can use the Search option in the following ways −

  • Add a Search, the dialog box in which a user can search your site only which makes it easy for users to find content on your site.

  • Add a box that lets the users to easily search the related sites.

  • Add a box that lets users search the Web, but without having to leave your site. This can be done by launching that search in another window.

There are two types of search options that you can use in your website.

  • Simple search
  • Advanced search

Simple Search

In this simple search option, the helper renders a box that includes the Bing search icon which users can click in order to launch the search.

  • In a simple search, the helper will also render radio buttons in which the user can specify whether to search only the specified site or the web in general.

  • When the user submits the search, the simple option just redirects the search to the Bing site − http://bing.com.

  • Then the results will be displayed in a new browser window, like user is searching in the Bing home page.

Advanced Search

In the advanced option, the helper will render a search box without radio buttons. In this case, the helper gets the search results and then formats and displays them right in that page instead of just redirecting to the Bing site.

Let’s have a look into a simple example of search by creating a new CSHTML file.

Search Cshtml

Enter Search.cshtml file in the Name field and click OK.

Replace the following code in the Search.cshtml file.

<!DOCTYPE html>
<html>
   
   <head>
      <title>Custom Bing Search Box</title>
   </head>
   
   <body>
      <div>
         <h1>Simple Search</h1>
         <p>The simple option displays results by opening a new browser window 
            that shows the Bing home page.</p>
         Search the ASP.NET site: <br/>
         @Bing.SearchBox(siteUrl: "www.asp.net")
      </div>
   
   </body>
</html>

As you can see in the above code, the siteUrl parameter in the @Bing.SearchBox() is optional, which means that you can specify the user has the option of which site to search. If you don’t specify a URL, then Bing will search the web.

You can see that we have specified the www.asp.net website, so it will search that site, but if you want to search your own site, then you will need to specify that URL instead of www.asp.net.

Let’s run the application and specify the following url − http://localhost:36905/Search and you will see the following output.

Simple Search

Let’s enter some text to search in the search box.

/Enter Text Box

Press enter and you will see that the Microsoft Bing home page opens in another tab.

Microsoft Bing Home Page
Advertisements