search functionaliity in mvc , its fetching but not binding

#dal

public List SearchRecord(string searchBy, string txtSearch)
{
try
{
EmployeeEntity emp = new EmployeeEntity();
using (AdventureWorksEntities empDbentity = new AdventureWorksEntities())
{
if (searchBy =="Empid")
{
var a = int.Parse(txtSearch);
return empDbentity.tblEmployees.Where(x => x.Empid == a || txtSearch == null).ToList();
}
else{
//var search = Convert.ToInt32(txtSearch);
return empDbentity.tblEmployees.Where(x => x.Empname.StartsWith(txtSearch) || txtSearch == null).ToList();
}
}
}
catch (Exception ex)
{
Log.WriteError("BorrowerImageGridView.EmployeeDataAcess.searchRecord()", ex);
throw new Exception(TUtil.GetMethodExceptionContext(searchBy, txtSearch), ex);
}

#controller

[HttpGet]
public ActionResult SearchRecord(string searchBy, string txtSearch)
{
List emp = empservice.SearchRecord(searchBy, txtSearch);
return View("EmployeeDetails", emp);
}

# my view

@using PagedList;
@using PagedList.Mvc;
@model IPagedList
@{
Layout = null;
ViewBag.Title = "EmployeeDetails";
}
"viewport" content="width=device-width" />
EmployeeForm
"stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
"http://code.jquery.com/jquery-3.3.1..min.js">
"https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js">
"~/Scripts/jquery-3.3.1.js">
"https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.1/jquery-ui.min.js" type="text/javascript">
"https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" />
class="panel panel-info margin">
class="panel-heading">Registered Employess

class="panel-body">

class="input-group">

Search By:

@Html.RadioButton("SearchBy", "Empname") Empname

@Html.RadioButton("SearchBy", "Empid") Empid

@Html.TextBox("txtSearch", "", new { @id = "txtSearch", @class = "form-control", style = " margin-bottom: 25px ;align-content:center; font-family:Arial, FontAwesome", placeholder = "Search" })

@*"text" classEmpl="form-control" id="txtSearch" placeholder="Search for...">*@

class="input-group-btn">

"btnSearch"class="btn btn-secondary" style="margin-bottom:4px;"type="submit">class="glyphicon glyphicon-search">

@*"txtSearch" style=" margin-bottom: 25px ;font-family:Arial, FontAwesome" type="text" placeholder=" ? Search " name=" search">

"button" class="btn btn-info" style=" margin-bottom: 25px">

class=" glyphicon glyphicon-search">

@*class="input-group">

" margin-bottom: 25px" type="text" class="form-control" placeholder="Search" />

class="input-group-btn">

class="glyphicon glyphicon-search">

Make sure you have deleted your yellow higlighted code from your view otherwise your method will get hit through ajax and not by form. So just remove the below code from view.

$(document).on('click', '#btnSearch', function () {
debugger;
var selectedItem = $("input[name=SearchBy]:checked").val();
$.ajax({
url: '/Employee/SearchRecord',
data: { searchBy: selectedItem,txtSearch: $('#txtSearch').val() },
type: "get",
sucess: function (response) {
}
});
this is my ajax call that is used to redirect to that controller method when clicked the search button
});
});

2. SerachRecord method should return pegedlist as i mentioned in my code.

If you still face issue, share your email I will send you sourcecode application.

its hitting its not a problem after that it should only show the searched record instead it is showing all the records in the grid like the one we select for. Thats the problem

till controller it is bringing all the regords which is being searched.

Hi Sangeetha, I tried to attached source code rar file for you but this site couldn't upload that.

Have you debug that search button click is hitting your method "SearchRecord" in controller? As i tried the same and its working fine to me. Just let me know if you are getting any error with the method response.

If it is not hitting to your method try this way to create form tag instead of manullay writing.:

@using (@Html.BeginForm("SearchRecord", "Employee", FormMethod.Get))
{
Search By:
@Html.RadioButton("SearchBy", "Empname") Empname
@Html.RadioButton("SearchBy", "Empid") Empid
@Html.TextBox("txtSearch", "", new { @id = "txtSearch", @class = "form-control", style = " margin-bottom: 25px ;align-content:center; font-family:Arial, FontAwesome", placeholder = "Search" })
@*"text" classEmpl="form-control" id="txtSearch" placeholder="Search for...">*@
class="input-group-btn">
}

no its not working ruchi

Hi Sangeetha,

You are using the same view for deafult listing as well as SerachRecords but for search you are using ajax. Ajax return you the response in success but doesn't refresh the changes it self, you will have to do that manually.

If you want to use the view than you will have do these changes:

A) For Controller : This function should return PagedList as the type of View is that.

[HttpGet]
public ActionResult SearchRecord(string searchBy, string txtSearch)
{
List emp = empservice.SearchRecord(searchBy, txtSearch);
return View("EmployeeDetails", emp.ToPagedList(1,50));
}

B) Instead of ajax you will have to use form tag. Delete the code written for btnsearch, use this code in your view for btnsearch:

<div class="input-group">
<form method="get" action="Employee/SearchRecord">
<b>Search By:b>
@Html.RadioButton("SearchBy", "Empname") <text>Empnametext>
@Html.RadioButton("SearchBy", "Empid") <text>Empidtext>
@Html.TextBox("txtSearch", "", new { @id = "txtSearch", @class = "form-control", style = " margin-bottom: 25px ;align-content:center; font-family:Arial, FontAwesome", placeholder = "Search" })
@*<input type="text" classEmpl="form-control" id="txtSearch" placeholder="Search for...">*@
<span class="input-group-btn">
<button id="btnSearch" class="btn btn-secondary" style="margin-bottom:4px;" type="submit"><i class="glyphicon glyphicon-search">i>button>
span>
form>
div>

It will post your search to your method and will list your result.

If you still want to do this using ajax, you will have to create a partial view which will show the result only and you will have to render that partial view wherever you want to show the result.

Hello sangeetha k,

You can use datable.js which fast and having in built funtionality.

https://datatables.net/

Its quiet simple to use and implement.

https://www.c-sharpcorner.com/article/using-datatables-grid-with-asp-net-mvc/

6 Replies

Know the answer? Post it — somebody with the same question will find it here.

Ruchi Sharavat8y ago
Make sure you have deleted your yellow higlighted code from your view otherwise your method will get hit through ajax and not by form. So just remove the below code from view.
$(document).on('click', '#btnSearch', function () {
debugger;
var selectedItem = $("input[name=SearchBy]:checked").val();
$.ajax({
url: '/Employee/SearchRecord',
data: { searchBy: selectedItem,txtSearch: $('#txtSearch').val() },
type: "get",
sucess: function (response) {
}
});
this is my ajax call that is used to redirect to that controller method when clicked the search button
});
});
2. SerachRecord method should return pegedlist as i mentioned in my code.

If you still face issue, share your email I will send you sourcecode application.
+1
sangeetha k8y ago
its hitting its not a problem after that it should only show the searched record instead it is showing all the records in the grid like the one we select for. Thats the problem
till controller it is bringing all the regords which is being searched.
0
Ruchi Sharavat8y ago
Hi Sangeetha, I tried to attached source code rar file for you but this site couldn't upload that.

Have you debug that search button click is hitting your method "SearchRecord" in controller? As i tried the same and its working fine to me. Just let me know if you are getting any error with the method response.

If it is not hitting to your method try this way to create form tag instead of manullay writing.:
@using (@Html.BeginForm("SearchRecord", "Employee", FormMethod.Get))
{
Search By:
@Html.RadioButton("SearchBy", "Empname") Empname
@Html.RadioButton("SearchBy", "Empid") Empid
@Html.TextBox("txtSearch", "", new { @id = "txtSearch", @class = "form-control", style = " margin-bottom: 25px ;align-content:center; font-family:Arial, FontAwesome", placeholder = "Search" })
@*"text" classEmpl="form-control" id="txtSearch" placeholder="Search for...">*@
class="input-group-btn">

}
+1
sangeetha k8y ago
no its not working ruchi
0
Ruchi Sharavat8y ago
Hi Sangeetha,

You are using the same view for deafult listing as well as SerachRecords but for search you are using ajax. Ajax return you the response in success but doesn't refresh the changes it self, you will have to do that manually.

If you want to use the view than you will have do these changes:
A) For Controller : This function should return PagedList as the type of View is that.
[HttpGet]
public ActionResult SearchRecord(string searchBy, string txtSearch)
{
List emp = empservice.SearchRecord(searchBy, txtSearch);
return View("EmployeeDetails", emp.ToPagedList(1,50));
}
B) Instead of ajax you will have to use form tag. Delete the code written for btnsearch, use this code in your view for btnsearch:
<div class="input-group">
                    <form method="get" action="Employee/SearchRecord">
                        <b>Search By:b>
                        @Html.RadioButton("SearchBy", "Empname") <text>Empnametext>
                        @Html.RadioButton("SearchBy", "Empid") <text>Empidtext>
                        @Html.TextBox("txtSearch", "", new { @id = "txtSearch", @class = "form-control", style = " margin-bottom: 25px ;align-content:center; font-family:Arial, FontAwesome", placeholder = "Search" })
                        @*<input type="text" classEmpl="form-control" id="txtSearch" placeholder="Search for...">*@
                        <span class="input-group-btn">
                            <button id="btnSearch" class="btn btn-secondary" style="margin-bottom:4px;" type="submit"><i class="glyphicon glyphicon-search">i>button>
                        span>
                    form>
                div>
It will post your search to your method and will list your result.
If you still want to do this using ajax, you will have to create a partial view which will show the result only and you will have to render that partial view wherever you want to show the result.
+1
Prateek Singla8y ago
Hello sangeetha k,

You can use datable.js which fast and having in built funtionality.

https://datatables.net/

Its quiet simple to use and implement.

https://www.c-sharpcorner.com/article/using-datatables-grid-with-asp-net-mvc/
+1