问题描述:

Two Javascripts Functions

  1. To Fix the Gridview Header

  2. To Auto Filter Gridview Rows upon Keypress in Textbox

Here's the joined code

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>

<script src="jquery/JQueryUICalendar/js/gridviewScroll.min.js" type="text/javascript"></script>

<script type="text/javascript">

//1st Function

var $160 = jQuery.noConflict();

$160(document).ready(function () {

gridviewScroll();

});

function gridviewScroll() {

$160('#<%=grdTenant.ClientID%>').gridviewScroll({

width: 1080,

height: 340,

// freezesize: 2, //kung gusto mag free yung column enable this pls

//IsInUpdatePanel: true

arrowsize: 30,

varrowtopimg: "images/arrowvt.png",

varrowbottomimg: "images/arrowvb.png",

harrowleftimg: "images/arrowhl.png",

harrowrightimg: "images/arrowhr.png"

});

}

//2nd Function

$KeyPressSearch = jQuery.noConflict();

function filter2(phrase, _id) {

$160('[id*=' + _id + '] tr:not(:has(th))').each(function (i, e) {

if (i != 0) {

$160(e).find('td').each(function (j, el) {

var div = $160('[id*=' + _id + '] tr:not(:has(th))').eq(0).find('td').eq(j).find('div').clone();

var val = $160(el).html();

$160(el).html("");

$160(el).append($160($160(div).html(val)))

});

}

});

var words = phrase.value.toLowerCase().split(" ");

var table = document.getElementById(_id);

var ele;

for (var r = 1; r < table.rows.length; r++) {

ele = table.rows[r].innerHTML.replace(/<[^>]+>/g, "");

var displayStyle = 'none';

for (var i = 0; i < words.length; i++) {

if (ele.toLowerCase().indexOf(words[i]) >= 0) displayStyle = '';

else {

displayStyle = 'none';

break;

}

}

table.rows[r].style.display = displayStyle;

}

var lblTotalDSRdata = $KeyPressSearch("#grdTenant tr").length;

}

input text

 <input id="txtTerm" name="txtTerm" onkeyup="filter2(this, '<%=grdTenant.ClientID %>')" type="text" size="40" />

gridview

 <AlternatingRowStyle BackColor="White" />

<Columns>

<asp:BoundField HeaderText="RP Code" DataField="Retail Partner Code" />

<asp:BoundField HeaderText="Retail Partner" DataField="Retail Partner" />

<asp:BoundField HeaderText="Type" DataField="type" />

<asp:BoundField HeaderText="Business" DataField="business" />

<asp:BoundField HeaderText="Floor" DataField="floor" />

<asp:BoundField HeaderText="Location" DataField="Location" />

<asp:BoundField HeaderText="SQM" DataField="sqm" />

<asp:BoundField HeaderText="Status" DataField="status" />

<asp:BoundField HeaderText="Vendor" DataField="vendor" />

<asp:BoundField HeaderText="IP Address" DataField="ip address" />

<asp:BoundField HeaderText="Group" DataField="group" />

<asp:BoundField HeaderText="Start Date" DataField="Start Date" />

<asp:BoundField HeaderText="Closed Date" DataField="Closed Date" />

</Columns>

<HeaderStyle CssClass="GridviewScrollHeader" />

<RowStyle CssClass="GridviewScrollItem" />

<PagerStyle CssClass="GridviewScrollPager" />

</asp:GridView>

The Problem occurring is that the system crashes when the gridview load many rows. and input keywords / characteres in the input text. otherwise, it works well

相关阅读:
Top