RadGrid edit highlight entire text in cell

4 posts, 0 answers
  1. Fred
    Fred avatar
    2 posts
    Member since:
    Dec 2014

    Posted 01 Dec 2014 Link to this post

    On a RadGrid, when I tab to edit a GridNumericColumn, the entire text in the cell gets highlighted. I would like for this same effect to happen for a GridBoundColumn. Is this possible?
  2. Jayesh Goyani
    Jayesh Goyani avatar
    2732 posts
    Member since:
    May 2010

    Posted 01 Dec 2014 in reply to Fred Link to this post

    Hi,

    (I am not able to reproduce it but) Please try with the below code snippet. 

    <style>
        .riTextBox:hover {
            background-color: red !important;
        }
    </style>


    Let me know if any concern.

    Thanks,
    Jayesh Goyani
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Fred
    Fred avatar
    2 posts
    Member since:
    Dec 2014

    Posted 01 Dec 2014 in reply to Jayesh Goyani Link to this post

    Hi Jayesh,
    Thanks for the reply. To clarify, I attached couple of snippets. The first one shows that when I enter the grid to edit, in a cell that is a GridNumericColumn (Qty), the data in the cell is highlighted in blue so that the entire content of the cell can be easily modified. In the second snippet, I've tabbed over to a GridBoundColumn (MFG), where instead of the entire text highlighting for edit as in the GridNumericColumn, the cursor lands at the beginning of the cell. This causes the editor to have to select the text in order to replace it. I'd like for the text to already be selected as in the GridNumericColumn so the user doesn't have to select the text in order to edit it.
  5. Eyup
    Admin
    Eyup avatar
    3005 posts

    Posted 04 Dec 2014 Link to this post

    Hello Fred,

    You can use the following approach to achieve the requested functionality:
    <ClientSettings>
        <ClientEvents OnBatchEditOpened="editOpened" />
    </ClientSettings>
    JavaScript:
    function editOpened(sender, args) {
        var editControl = sender.get_batchEditingManager()._getDataControl(args.get_row(), args.get_columnUniqueName());
        if (editControl.tagName == "INPUT") {
            setTimeout(function () {
                editControl.select();
            }, 2)
        }
    }

    Hope this helps.

    Regards,
    Eyup
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
Back to Top