Click here to Skip to main content
12,892,596 members (46,210 online)
Rate this:
 
Please Sign up or sign in to vote.
See more: Gridview grid
Unable to set property 'className' of undefined or null reference.
 
When i click the selected row in a grid i am getting the following error. It should fire gridview_selectedIndexChanged() event. but it will not fire anything. rather than it will shoe the below error.
 
Error : JavaScript runtime error: Unable to set property 'className' of undefined or null reference.
 
Error code :
 
ASPX Page
 
  var gridviewID = "<%=grdSearch.ClientID%>";         var gridview = null;
 
        var selectedRowIndex = -1;
 
        $(document).ready(function () {             gridview = $('#' + gridviewID);
 
        });
 
        function RowMouseOver(rowIndex) {             if (selectedRowIndex == rowIndex) return;
 
            var gridviewID = "<%=grdSearch.ClientID%>";             $('#' + gridviewID)[0].rows[rowIndex + 1].className = 'GridviewScrollItemHover';
 
        }
 
        function RowMouseOut(rowIndex) {             if (selectedRowIndex == rowIndex) return;
 
            var gridviewID = "<%=grdSearch.ClientID%>";             $('#' + gridviewID)[0].rows[rowIndex + 1].className = 'GridviewScrollItem';
 
        }
 
        function RowSelect(rowIndex) {             if (selectedRowIndex == rowIndex) return;
 
            RowReset(selectedRowIndex);
 
            selectedRowIndex = rowIndex;
 
            var gridviewID = "<%=grdSearch.ClientID%>";             $('#' + gridviewID)[0].rows[rowIndex + 1].className = 'GridviewScrollItemSelected';
 
        }
 
        function RowReset(rowIndex) {
 
            var gridviewID = "<%=grdSearch.ClientID%>";             $('#' + gridviewID)[0].rows[rowIndex + 1].className = 'GridviewScrollItem';
 
        }
 
ASPX.Vb
 
 
 
If e.Row.RowType = DataControlRowType.DataRow Then
 
               
 
If e.Row.RowType <> DataControlRowType.DataRow Then
 
                   
 
Return
 
               
 
End If
 
                e.Row.Attributes(
 
"onmouseover") = String.Format("RowMouseOver({0});", e.Row.RowIndex)
 
                e.Row.Attributes.Add(
 
"style", "cursor:pointer;")
 
                e.Row.Attributes(
 
"onmouseout") = String.Format("RowMouseOut({0});", e.Row.RowIndex)
 
                e.Row.ToolTip =
 
"Click to select row"
 
                e.Row.Attributes(
 
"onclick") = String.Format("RowSelect({0});", e.Row.RowIndex)
 
           
 
End If
 

my Requirment is :
 
When i selecte the particular row, it should highlight the row in diff color at the same time the index value should get display in another gridview
 
pls. help me to solve this problem. i am unable to find out exact solution for this.


What I have tried:

function RowReset(rowIndex) {
$('#' + gridviewID +'tbody > tr').eq(rowindex+1).addClass('GridviewScrollItem');
}

But, not working...
Posted 21-Apr-17 1:45am
gani77871.5K
Updated 21-Apr-17 2:00am

1 solution

Rate this: bad
 
good
Please Sign up or sign in to vote.

Solution 1

Validate the object for null value before accessing the members of the object
var row = $('#' + gridviewID)[0].rows[rowIndex + 1]
if(row1 != null){
     row1.className = 'Your Class Name'
}
  Permalink  
Comments
gani7787 21-Apr-17 9:08am
   
Thanks for your reply,

but, gridview_selectedIndexchanged not firing after using this code...
Karthik Bangalore 21-Apr-17 11:58am
   
this has nothing to do with the server event. you might be missing something.
gani7787 3 days ago
   
Thanks.

Now i solved the rowindex error.

But, mainly i have two important points to discuss.

Scenario : when i selected the row in gridview1, then it should bring all the employee records in gridview2 based on gridview1 index selection.

Problem_1 : In gridview i have "n" number of rows. when i select then it should maintain the same position even if scrolling the rows. the below code is working for selected rows maintain the same postion. But, SeletedIndex Changed Event not Firing

e.Row.Attributes("onmouseover") = String.Format("RowMouseOver({0});", e.Row.RowIndex)

e.Row.Attributes("onmouseout") = String.Format("RowMouseOut({0});", e.Row.RowIndex)
e.Row.Attributes("onclick") = String.Format("RowSelect({0});", e.Row.RowIndex) (event not Firing)

Problem_2 : Suppose selected row not maintain the same position,but, it will bring all the records in gridview2. It means selectedIndexchanged is firing. The below code is working for that.

e.Row.Attributes("onmouseover") = String.Format("RowMouseOver({0});", e.Row.RowIndex)
e.Row.Attributes("onmouseout") = String.Format("RowMouseOut({0});", e.Row.RowIndex)
'e.Row.Attributes("onclick") = String.Format("RowSelect({0});", e.Row.RowIndex) (event not Firing)
e.Row.Attributes.Add("onclick", Page.ClientScript.GetPostBackEventReference(grdSearchResult, "Select$" + e.Row.RowIndex.ToString())) (event firing).

My scenario is, i want to maintain selected row in the same position also it should fire the selectedIndexchanged event (both scenario).

Below is the common script



var gridviewID = "<%=grdSearchResult.ClientID%>";
var gridview = null;

var selectedRowIndex = -1;

$(document).ready(function () {
gridview = $('#' + gridviewID);

});

function RowMouseOver(rowIndex) {
if (selectedRowIndex == rowIndex) return;

var gridviewID = "<%=grdSearchResult.ClientID%>";
$('#' + gridviewID)[0].rows[rowIndex + 1].className = 'GridviewScrollItemHover';


}

function RowMouseOut(rowIndex) {
if (selectedRowIndex == rowIndex) return;

var gridviewID = "<%=grdSearchResult.ClientID%>";
$('#' + gridviewID)[0].rows[rowIndex + 1].className = 'GridviewScrollItem';



}

function RowSelect(rowIndex) {
if (selectedRowIndex == rowIndex) return;

RowReset(selectedRowIndex);

selectedRowIndex = rowIndex;

var gridviewID = "<%=grdSearchResult.ClientID%>";
$('#' + gridviewID)[0].rows[rowIndex + 1].className = 'GridviewScrollItemSelected';

}

function RowReset(rowIndex) {
var row = $('#' + gridviewID)[0].rows[rowIndex + 1]
if (row != null) {
row.className = 'GridviewScrollItem'
}

}



where is the problem....?

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

    Print Answers RSS
Top Experts
Last 24hrsThis month


Advertise | Privacy | Mobile
Web02 | 2.8.170424.1 | Last Updated 21 Apr 2017
Copyright © CodeProject, 1999-2017
All Rights Reserved. Terms of Service
Layout: fixed | fluid

CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100