Reputation: 73
I'm building an e-commerce web app using ASP.NET Core MVC. I've one search bar on my _layout page. I want to display the item's details such as image, title, and price these values are already stored in the database. I've attached one image with this question. I want to make my search bar something like this image:
My search bar code is below:
<div class="olContent f1">
<form method="get" asp-controller="Home" asp-action="AllProducts">
<div class="olSearch fr">
<input type="text" name="search" placeholder="Enter Keyword" class="inputComn form-control"/>
<div class="searchIcon">
<button type="submit" class="searchBtn">
<img src="~/images/searchIcon.png"/>
</button>
</div>
</div>
</form>
</div>
Upvotes: 3
Views: 437
Reputation: 132
You can use twitter typeahead jsplugin. With this you have an option to design your own template(i.e how your search should be displayed). Go through custom template in the above link.
https://twitter.github.io/typeahead.js/examples/
Upvotes: 1