Hi,
In my application iam using jquery in gridview.
when i hover mouse on an anchor ,atooltip with corresponding records will display.
my problem is gridview contains paging. only first page of gridview shows tooltip.another pages doesn't show tooltip.
code is follows
for this code i have 3 records
every page contains 1 record. iam struck here any one have an idea plz help me.
Regards
K L BAIJU
<script src="jquery-1.2.6.js" type="text/javascript"></script>
<script src="vsdoc.js" type="text/javascript"></script>
<script type="text/javascript" language="javascript">
$(document).ready(function() {
var rows = $('#<%=GridView1.ClientID%>').find(' tbody .record ').length;
alert(rows);
var no_rec_per_page = 1;
var no_pages = Math.ceil(rows / no_rec_per_page);
var $pagenumbers = $('<div id="pages"></div>');
for (i = 0; i < no_pages; i++) {
$('<a href="#" class="page">' + (i + 1) + '</a>').appendTo($pagenumbers);
}
$pagenumbers.insertAfter('#<%=GridView1.ClientID%>');
$('.page').hover(function() {
$(this).addClass('hover');
}, function() {
$(this).removeClass('hover');
});
$('#<%=GridView1.ClientID%>').find(' tbody .record ').hide();
var tr = $('#<%=GridView1.ClientID%> tbody .record ');
for (var i = 0; i <= no_rec_per_page - 1; i++) {
$(tr[i]).show();
}
$('a').click(function(event) {
$('#<%=GridView1.ClientID%>').find(' tbody .record ').hide();
for (i = ($(this).text() - 1) * no_rec_per_page; i <= $(this).text() * no_rec_per_page - 1; i++) {
$(tr[i]).show();
}
});
//
$('.anchor1').mouseover(function() {
$("#disp").show();
var pos = $(this).offset();
var width = $(this).width();
$("#disp").css({
left: (pos.left + width) + 'px',
top: pos.top - 5 + 'px'
});
var id1 = $(this).attr("id");
var ID = 'CustomerID=' + id1;
// Display(ID);
$.ajax({
type: "GET",
url: "CricketProcess.aspx",
data: ID,
success: function(data) {
$("#disp").show("slow");
$("#disp").html(data);
}
});
return false;
});
$('.anchor1').mouseout(function() {
$("#disp").hide();
});
$('#Text1').mouseout(function() {
$("#dsp").hide();
});
});