title: How to navigate (up or down) in ASP.NET gridview using arrow keys?
body: <p>How to navigate (up or down) in ASP.NET gridview using arrow keys while highlighting the current row?</p>
  
  <p>I am able to move through rows with up and down arrow keys using javascript code and C# code. I also implemented a begin request and end request JS code for maintaining scroll position on postback.</p>
  
  <p>However, my problem is, scrollbar doesn't move up or down to show the highlighted row automatically. Suppose there are 100 rows, I select 15th row, but grid height is like it can show only 10 rows, unless we move scroll bar manually, it doesn't move automatically to display the selected row via arrow keys. How to ensure this synchronous or visibility of highlighted row by moving scroll bar?</p>
  
  <p>My gridview doesn't have checkbox.</p>
  
  <p>Please help me. Its my code here:</p>
  
  <p> </p>
  
  <pre><code>&lt;asp:GridView ID="gvCycles" runat="server" AutoGenerateColumns="False" 
      CssClass="grid"
      AllowSorting="True"
      ShowHeader="False"
      ShowFooter="True"
      OnSelectedIndexChanged="gvDeductionList_SelectedIndexChanged" 
      OnRowDataBound="gvDeductionList_RowDataBound" DataKeyNames="CycleID" onselectedindexchanging="gvCycles_SelectedIndexChanging"
      &gt;
      &lt;Columns&gt;               
          &lt;asp:BoundField DataField="CycleID" HeaderText="CycleID"
              HtmlEncode="False"                    
              SortExpression="CycleID"&gt;
              &lt;ItemStyle CssClass="GridViewHiddenColumn" /&gt;    
          &lt;/asp:BoundField&gt; 
  </code></pre>
  
  <p>What I did to maintain the scroll position on postback is:</p>
  
  <pre><code>&lt;script language="javascript" type="text/javascript"&gt;
      // This Script is used to maintain Grid Scroll on Partial Postback
      var scrollTop;
      //Register Begin Request and End Request 
      Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(BeginRequestHandler);
      Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
      //Get The Div Scroll Position
      function BeginRequestHandler(sender, args) {
          var m = document.getElementById('divGrid');
          scrollTop = m.scrollTop;
      }
      //Set The Div Scroll Position
      function EndRequestHandler(sender, args) {
          var m = document.getElementById('divGrid');
          m.scrollTop = scrollTop;
      } 
  &lt;/script&gt;
  </code></pre>
  
  <p>Also, I have this in the keydown and keyup</p>
  
  <pre><code> if (e.keyCode == '38') {
                  document.getElementById('&lt;%= controlCapture.ClientID %&gt;').value = false;
                  document.getElementById('&lt;%= shiftCapture.ClientID %&gt;').value = false;
                  // up arrow
                  __doPostBack(pageId, "up");
              }
  else if (e.keyCode == '40') {
                  document.getElementById('&lt;%= controlCapture.ClientID %&gt;').value = false;
                  document.getElementById('&lt;%= shiftCapture.ClientID %&gt;').value = false;
                                // down arrow
                  __doPostBack(pageId, "down");
  </code></pre>
  
  <p>Question: I do not know where to use the code you mentioned in the codeproject such that, when I press key down or up arrow keys, it should move scroll bar automatically. I do not have pagination.</p>
  
  <p><strong>Page_load Code</strong></p>
  
  <pre><code>protected void Page_Load(object sender, EventArgs e)
      {
          if (!IsPostBack) //on initial load, default dates to current fbt year
          {
              dpDateFrom.DateValue = currentBT;
              dpDateTo.DateValue = currentBTEnd;
  
              Searchclick();
          }
              //cursor keys
          else if (Request.Form["__EVENTARGUMENT"] == "up" || Request.Form["__EVENTARGUMENT"] == "down")
          {
              string eventArgument = Request.Form["__EVENTARGUMENT"];
              int intPayCycleId = 0;
  
              if (gvCycles.SelectedIndex &gt;= 0 &amp;&amp; gvCycles.SelectedIndex &lt; gvCycles.Rows.Count)
              {
                  if (eventArgument == "down")
                  {
                      if (gvCycles.SelectedIndex &lt; gvCycles.Rows.Count-1)
                      {
                          gvCycles.SelectedIndex += 1;
  
                      }
                  }
                  else if (eventArgument == "up")
                  {
                      if (gvCycles.SelectedIndex &gt; 0)
                      {
                          gvCycles.SelectedIndex -= 1;
                      }
                  }
  
                  hdnSelectedRow.Value = gvCycles.SelectedValue.ToString() + ","; //assign hidden value with selected row
                  SetRowsStyle(gvCycles);
  
                  if (int.TryParse(gvCycles.SelectedRow.Cells[0].Text, out intCycleId))
                  {
                      ShowDeductions(intCycleId, false);
                  }
              }
          }
      }
  </code></pre>