Accessing the Cancel button in GridEditCommandColumn via enter key - part of a larger problem

2 posts, 1 answers
  1. Will
    Will avatar
    4 posts
    Member since:
    Nov 2011

    Posted 18 Nov 2011 Link to this post

    We have a complex use case with a RadGrid inside a panel on a page with a master page, multiple user controls, vaildators, a defaultbutton &c.
    The problem is that with all this going on, accessing the RadGrid via tab and enter keys has become problematic.

    Tabbing through the page and getting to the [+] Add New Record buttons (the InitInsert buttons?) on the page, and then hitting enter in the default scenario causes our default button for the page to fire which is not what we want.  We'd like the same thing to happen as if we clicked on it - a new row to be added to the grid.

    As a work around, I have enabled keyboard validation, and set the OnKeyPress event in the client events to call javascript where I evaluate the key, see if it's the enter key, and then if so, examine the innerHTML to see what sent it to the JS.

    This is bad enough and a poor solution for obvious reasons.  However, for the cancel button that is part of the GridEditCommandColumn, the validators on the page are firing which is not what happens when you just click on the Cancel link button in the grid.

    I figure there has to be a better built in way of accessing the grid fully via the keyboard with standard tab and enter keys, rather than the non standard keyboard shortcuts, or if I have to do it htis way for all the buttons in the control to be properly caught and handled through javascript.

    Any advice would be appreciated.
    function OnKeyPress(key)
     var e = window.event;     
     if(e.keyCode==13) {
         if (e.srcElement.outerHTML.indexOf("AddNewRecordButton") > -1 || e.srcElement.outerHTML.indexOf("$InitInsertButton") > -1) {
             __doPostBack('ctl00$ContentPlaceHolder1$RadGrid1$ctl00$ctl02$ctl00$InitInsertButton', '');
             return false;
         if (e.srcElement.outerHTML.indexOf("ctl02_CancelButton") > -1) {
             __doPostBack('ctl00$ContentPlaceHolder1$RadGrid1$ctl00$ctl02$ctl02$CancelButton', '');
             return false;
         if (e.srcElement.outerHTML.indexOf("ctl04_CancelButton") > -1) {
             //__doPostBack('ctl00$ContentPlaceHolder1$RadGrid1$ctl00$ctl04$CancelButton', '');
             WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions("ctl00$ContentPlaceHolder1$RadGrid1$ctl00$ctl04$CancelButton", "", true, "StateAllocationValidation", "", false, true));
             return false;
         if (e.srcElement.outerHTML.indexOf("$PerformInsertButton") > -1) {
             WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions("ctl00$ContentPlaceHolder1$RadGrid1$ctl00$ctl02$ctl02$PerformInsertButton", "", true, "", "", false, true));
             return false;
         if (e.srcElement.outerHTML.indexOf("$EditButton") > -1) {
             __doPostBack('ctl00$ContentPlaceHolder1$RadGrid1$ctl00$ctl04$EditButton', '');
             return false;
         if (e.srcElement.outerHTML.indexOf("Delete") > -1) {
             __doPostBack('ctl00$ContentPlaceHolder1$RadGrid1$ctl00$ctl04$ctl00', '');
             return false;
         if (e.srcElement.outerHTML.indexOf("UpdateButton") > -1) {
             WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions("ctl00$ContentPlaceHolder1$RadGrid1$ctl00$ctl04$UpdateButton", "", true, "StateAllocationValidation", "", false, true));
             return false;

  2. Answer
    Tsvetoslav avatar
    1823 posts

    Posted 23 Nov 2011 Link to this post

    Hello Will,

    The standard work-around for this problem is to add a hidden button to the page and set its id to the form tag's DefaultButton attribute. Do note this is a shortcoming of the web forms framework.

    Hope it helps.

    Best wishes,
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now
Back to Top