This is a migrated thread and some comments may be shown as answers.

[Solved] Keyboard Navigation & Validation

2 Answers 41 Views
Grid
This is a migrated thread and some comments may be shown as answers.
This question is locked. New answers and comments are not allowed.
Dan
Top achievements
Rank 1
Dan asked on 10 Jul 2012, 02:11 PM
Hello

I want to be able to use tab for fast and easy navigation in my grid also while the validation isn't good
so there are two things here
Validation halts other input actions, the user isn't able to edit another cell in if another is not valid
how to combine the function of the 'tab' key and 'enter' key, so my uses dont have to additional key input

Ex.: I input a Email not being Valid and then is still able to tab then edit the next field

if didn't make it clear enough please don't hesitate to ask, i will appreciate it

@(
    Html.Telerik().Grid(Model)
        .Name("Player")
        .ClientEvents(events =>
        {
            events.OnDataBound("Grid_onDataBound");
            events.OnSubmitChanges("Grid_onSubmitChanges");
            events.OnError("Grid_onError");
        })
        .Sortable(sorting => sorting.Enabled(true))
        .DataKeys(keys => keys.Add(o => o.Id)
            .RouteKey("Id"))
        .ToolBar(commands =>
        {
            commands.Insert().ButtonType(GridButtonType.Image).ImageHtmlAttributes(new { style = "margin-left:0" });
            commands.SubmitChanges().ButtonType(GridButtonType.Image);
        })
        .DataBinding(dataBinding => dataBinding.Ajax()
            //.Insert("Players_update", "Player", new { Tournament = ViewBag.TournamentID })
            .Select("Select_players", "Player", new { Tournament = ViewBag.TournamentID })
            .Update("Players_update", "Player", new { Tournament = ViewBag.TournamentID })
            //.Delete("Players_update", "Player", new { Tournament = ViewBag.TournamentID })
        )
        .PrefixUrlParameters(false)
        .Columns(columns =>
        {
            columns.Bound(o => o.FirstName).Width(180);
            columns.Bound(o => o.LastName).Width(180);
            columns.Bound(o => o.Email).Width(200);
            columns.Bound(o => o.Hcp).Width(30)        
            columns.ForeignKey(o => o.Sex, (IEnumerable)ViewData["gender"], "Id", "Text").Width(120);
            columns.ForeignKey(o => o.Country, (IEnumerable)ViewData["country"], "Id", "Name").Width(120);
            columns.Bound(o => o.IsPro).Width(30);
            columns.Command(commands =>
            {
                commands.Edit().ButtonType(GridButtonType.Image);
                commands.Delete().ButtonType(GridButtonType.Image);
            });
        })
        .Editable(editing => editing.Mode(GridEditMode.InCell))
        .KeyboardNavigation()

2 Answers, 1 is accepted

Sort by
0
Dan
Top achievements
Rank 1
answered on 10 Jul 2012, 02:27 PM
After countless hours of searching i made this post but 30 min after i found the solution

which where to add

.KeyboardNavigation( navigation => navigation.EditOnTab(true))

hope it helps someone else!
0
Vijay
Top achievements
Rank 1
answered on 07 Feb 2013, 02:02 PM
thanks buddy
this solve my problem also.....
Tags
Grid
Asked by
Dan
Top achievements
Rank 1
Answers by
Dan
Top achievements
Rank 1
Vijay
Top achievements
Rank 1
Share this question
or