I am attempting to get a div to show and follow the mouse based on the row that the mouse is over. It seems that I can't get the right element to target in order to make this work.
In the code below lblEnclarityReportsPerPayer gets filled from codebehind with tables that have an ID that corresponds to the simpleRequestDate. The problem is that my $("tr.rgHoveredRow").mousemove() is not firing.
In the code below lblEnclarityReportsPerPayer gets filled from codebehind with tables that have an ID that corresponds to the simpleRequestDate. The problem is that my $("tr.rgHoveredRow").mousemove() is not firing.
<
telerik:RadGrid
runat
=
"server"
ID
=
"gvReport"
DataSourceID
=
"dsReport"
>
<
ClientSettings
>
<
ClientEvents
OnRowMouseOver
=
"showPayerBreakOut"
OnRowMouseOut
=
"hidePayerBreakOut"
/>
</
ClientSettings
>
<
MasterTableView
DataKeyNames
=
"simpleRequestDate"
ClientDataKeyNames
=
"simpleRequestDate"
CommandItemDisplay
=
"Top"
PageSize
=
"100"
>
<
CommandItemSettings
ShowExportToExcelButton
=
"true"
ShowAddNewRecordButton
=
"false"
/>
<
Columns
>
<
telerik:GridDateTimeColumn
DataField
=
"RequestDate"
DataFormatString
=
"{0:MM/dd/yyyy}"
HeaderText
=
"Request Date"
SortExpression
=
"RequestDate"
ItemStyle-HorizontalAlign
=
"Center"
HeaderStyle-HorizontalAlign
=
"Center"
/>
<
telerik:GridBoundColumn
DataField
=
"requests"
HeaderText
=
"Requests"
SortExpression
=
"requests"
ItemStyle-HorizontalAlign
=
"Center"
HeaderStyle-HorizontalAlign
=
"Center"
/>
<
telerik:GridBoundColumn
DataField
=
"faxNumbersReceived"
HeaderText
=
"Fax Numbers Received"
SortExpression
=
"faxNumbersReceived"
ItemStyle-HorizontalAlign
=
"Center"
HeaderStyle-HorizontalAlign
=
"Center"
/>
<
telerik:GridBoundColumn
DataField
=
"percentage"
HeaderText
=
"Percentage Found"
SortExpression
=
"percentage"
ItemStyle-HorizontalAlign
=
"Center"
HeaderStyle-HorizontalAlign
=
"Center"
/>
</
Columns
>
</
MasterTableView
>
</
telerik:RadGrid
>
<
script
type
=
"text/javascript"
>
$(document).ready(function () {
$('#payerReports span').children().each(function () {
$(this).hide();
});
});
var moveLeft = 20;
var moveDown = 10;
$("tr.rgHoveredRow").mousemove(function (e) {
$('#payerReports').css('top', e.pageY + moveDown).css('left', e.pageX + moveLeft);
});
function showPayerBreakOut(sender, eventArgs) {
$("#" + eventArgs.getDataKeyValue("simpleRequestDate")).show();
}
function hidePayerBreakOut(sender, eventArgs) {
$("#" + eventArgs.getDataKeyValue("simpleRequestDate")).hide();
}
</
script
>
<
div
id
=
"payerReports"
>
<
asp:Label
runat
=
"server"
ID
=
"lblEnclarityReportsPerPayer"
/>
</
div
>