Search option using textbox key press for gridview with paging in C# ASP.NET using jquery?

Question

0.00/5 (No votes)

See more:

Hello,

Search option using textbox key press for gridview with paging in c# asp.net using jquery?

My search code is running fine without paging but when i set allow paging true so,
It was searching only 5 rows.

My search code not running with paging.
i have use input type text:

HTML

<input name="search" type="text" id="search" value="" autocomplete="off" onkeyup="Search_Gridview(this,'gvEmpSkillDetails')" class="form-control" placeholder="Search">

for searching.

Please help me.

Thanks in Advance.

Ankit Agarwal

What I have tried:

<script type="text/javascript">
function Search_Gridview(strKey, strGV) {
var strData = strKey.value.toLowerCase().split(" ");
var tblData = document.getElementById(strGV);
var rowData;
for (var i = 1; i < tblData.rows.length; i++) {
rowData = tblData.rows[i].innerHTML;
var styleDisplay = 'none';
for (var j = 0; j < strData.length; j++) {
if (rowData.toLowerCase().indexOf(strData[j]) >= 0)
styleDisplay = '';
else {
styleDisplay = 'none';
break;
}
}
tblData.rows[i].style.display = styleDisplay;
}
}
</script>

Posted 27-Jul-16 0:14am

Agarwal1984

Updated 27-Jul-16 8:06am

v3

Add a Solution

2 solutions

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Karthik_Mahalingam · Answer 1 · 2016-07-27T08:06:00

Since you are using javascript to query/filter the data which is displaying on the screen(gridview) , Obviously it will filter only the data available on the screen(gridivew) based on your if conditions.
This is how javascript works

When you are using pagination (eg 10 records per page), The Server will transfer only 10 records to the web browser in an HTML Table[^] format and you code will query that 10 records only, not the entire dataset.
if you want to filter the entire data, you should remove the pagination, so that the whole dataset will be transferred to the browser in an HTML Table format.

Your Javascript code has the Control over DOM [^]only, not to the server data, if you want to do the filtering over server data by using Javascript then you will have to use JQuery AJAX[^] to get the data asynchronously and based on the JSON [^] result data, build the HTML table dynamically[^].

This is how you can resolve your issue.

deepankarbhatnagar · Answer 2 · 2016-07-27T01:17:00

Solution 1

Please see the links below for your help.

Search GridView with Paging on TextBox KeyPress using jQuery in ASP.Net[^]

Search GridView with Paging on TextBox KeyPress using jQuery in ASP.Net – DTKit[^]

Posted 27-Jul-16 1:17am

deepankarbhatnagar

Comments

Agarwal1984 27-Jul-16 7:20am

I saw both link but one image column also in my gridview.
SO, how to add or bind image column using c# or jquery?

Agarwal1984 27-Jul-16 7:21am

<asp:ImageField DataImageUrlField="EMPIMG" HeaderText="Person" ControlStyle-Width = "100" ControlStyle-Height = "100">
<controlstyle width="100px" height="100px">

<HeaderStyle Font-Bold="True" />