Telerik MVC Grid 关注页面加载时的第一个过滤器字段答案

【问题标题】：Telerik MVC Grid focus on first filter field on page loadTelerik MVC Grid 关注页面加载时的第一个过滤器字段
【发布时间】：2019-03-15 20:16:20
【问题描述】：

我正在尝试找到一种方法，以便在页面初始加载时设置用户光标并专注于 item_id 过滤器文本框。类似于如何为剃须刀页面“@autofocus =”autofocus“”或

$(function () {
    $('.focus :input:first').focus();
});

当用户加载页面时，我似乎找不到有效的解决方案来关注过滤器行。

我正在尝试将焦点放在“item_id”过滤器文本框上

这就是网格的列部分的样子。我试图在网格加载时添加一个事件以查找文本框，然后设置焦点，但它看起来没有任何暴露。

    @(Html.Kendo().Grid<Portal.Models.Location_Inventory>()
                                    .Name("grid")
                                        .Columns(columns =>
                                        {
                                            columns.Bound(p => p.item_id).Title("Item ID").Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)).UI("focus"));
                                            columns.Bound(p => p.item_desc).Title("Item Desc").Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
                                            columns.Bound(p => p.ext_desc).Title("Extended Desc").Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
                                            columns.Bound(p => p.vmi_pkg).Title("VMI Pack Size").Filterable(false).Width(125);
                                            columns.Bound(p => p.bin).Title("Bin").Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains))).EditorTemplateName("String");
                                            columns.Bound(p => p.qty_issued).Title("Qty to Issue").Filterable(false).EditorTemplateName("Integer").Width(125);                                        
                                            columns.Bound(p => p.qty_on_hand).Title("Qty on Hand").Filterable(false).EditorTemplateName("Integer").Width(125);

                                })

【问题讨论】：

标签： javascript model-view-controller grid telerik focus

【解决方案1】：

看看这是否适合你。

@(Html.Kendo().Grid<Portal.Models.Location_Inventory>()
                                    .Name("grid")
                                        .Columns(columns =>
                                        {
                                            columns.Bound(p => p.item_id).Title("Item ID").Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)).UI("focus"));
                                            columns.Bound(p => p.item_desc).Title("Item Desc").Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
                                            columns.Bound(p => p.ext_desc).Title("Extended Desc").Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
                                            columns.Bound(p => p.vmi_pkg).Title("VMI Pack Size").Filterable(false).Width(125);
                                            columns.Bound(p => p.bin).Title("Bin").Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains))).EditorTemplateName("String");
                                            columns.Bound(p => p.qty_issued).Title("Qty to Issue").Filterable(false).EditorTemplateName("Integer").Width(125);                                        
                                            columns.Bound(p => p.qty_on_hand).Title("Qty on Hand").Filterable(false).EditorTemplateName("Integer").Width(125);

                                }).Events(ev => ev
                                            .DataBound("onDataBound")
                                 )
<script>
function onDataBound(arg) {
    $('[data-text-field="item_id"]').focus();
}
</script>

【讨论】：