Not showing partial view result inside table body in asp.net MVC - asp.net-mvc

Question

I have written code to implement search using ajax in asp.net MVC. I have written an action inside my controller (Admincontroller) using partial view which is supposed to fetch data. I want to display the partial view result inside table body in my Index page.
The search function is working fine, but it is not displaying the result inside table body with id "searchresult" (Inside Index page). instead of that it is giving result. I wanted the result from search in table format. now result is displayed like below in http://localhost:1274/Admin/Search.
2786 Mens L/S 4000
here is my Index.cshtml
#model IEnumerable<TestEntityFramework.Models.trProducts>
#{
ViewBag.Title = "Index";
Layout = "~/Views/Shared/_AdminLayout.cshtml";
AjaxOptions ajax = new AjaxOptions
{
UpdateTargetId = "searchresult",
Confirm = "Are you sure to start search?",
InsertionMode = InsertionMode.Replace,
LoadingElementId="Loadhere"
};
}
<h2>Index</h2>
<script src="~/scripts/jquery.unobtrusive-ajax.js"></script>
<script src="~/scripts/jquery.unobtrusive-ajax.min.js"></script>
<div class="panel-heading">
<div>
#Html.ActionLink("Create New", "Create",null, new{ #class="btn btn- primary" })
</div>
</div>
<div class="panel-body">
<table class="table table-striped table-bordered table-condensed table- hover table-responsive">
<tr>
<th>
#Html.DisplayNameFor(model => model.prod_type)
</th>
<th>
#Html.DisplayNameFor(model => model.prod_name)
</th>
<th>
#Html.DisplayNameFor(model => model.prod_desc)
</th>
<th>
#Html.DisplayNameFor(model => model.prod_price)
</th>
<th>
#Html.DisplayNameFor(model => model.prod_qty)
</th>
<th>
#Html.DisplayNameFor(model => model.prod_category)
</th>
<th></th>
</tr>
#foreach (var item in Model) {
<tr>
<td>
#Html.DisplayFor(modelItem => item.prod_type)
</td>
<td>
#Html.DisplayFor(modelItem => item.prod_name)
</td>
<td>
#Html.DisplayFor(modelItem => item.prod_desc)
</td>
<td>
#Html.DisplayFor(modelItem => item.prod_price)
</td>
<td>
#Html.DisplayFor(modelItem => item.prod_qty)
</td>
<td>
#Html.DisplayFor(modelItem => item.prod_category)
</td>
<td>
#Html.ActionLink("Edit", "Edit", new {id=item.product_id}) |
#Html.ActionLink("Details", "Details", new { id=item.product_id }) |
#Html.ActionLink("Delete", "Delete", new { id=item.product_id })
</td>
</tr>
}
</table>
</div>
<div class="col-lg-8">
<table class="table table-bordered table-striped table-hover">
<thead>
<tr>
<th>
Product Id
</th>
<th>
Product Name
</th>
<th>
Price
</th>
<th>
</th>
</tr>
</thead>
<tbody id="searchresult">
#Html.Action("Search", new { pr_name = "" })
</tbody>
</table>
#using (Ajax.BeginForm("Search", ajax))
{
<div id="Loadhere">
#Html.TextBox("pr_name")
<button class="btn btn-primary">Search</button>
</div>
}
</div>
and my partialview Search.cshtml looks as below
#model IEnumerable<TestEntityFramework.Models.trProducts>
#foreach(var m in Model)
{
<tr>
<td>
#m.product_id
</td>
<td>
#m.prod_name
</td>
<td>
#m.prod_price
</td>
</tr>
}