2015-12-03 67 views
0

我正在使用MVC Razor和Telerik Kendo MVC。我有一个我希望自动设置焦点的dropdownlst,以便用户可以立即开始键入和过滤所需的值。该DDL是:Kendo UI MVC DropDownList过滤焦点

@(Html.Kendo().DropDownList() 
    .Name("ddlLocations") 
    .Filter("contains") 
    .BindTo(Model.Locations) 
    .DataTextField("Text") 
    .DataValueField("Value") 
    .Events(events => events.Change("onChange")) 
    .HtmlAttributes(new { style = "width:100%" }) 
    .Value(Model.Exception.LocationIDCouponTypeStatus) 
) 

我有一个类似的项目在ASP.NET WebForms和我在Javascript中所做的是:

var comboBox = $find("<%=ddl.ClientID %>"); 
comboBox._inputDomElement.select(); 

这集中在告诉它开始过滤控制的部分当用户开始输入时。它似乎没有翻译成MVC版本。

var comboBox = $("#ddlLocations").data("kendoDropDownList"); 
comboBox._inputDomElement.select(); 

任何想法?提前致谢。

回答

0

你需要先打开下拉列表:

.Events(p => p.DataBound("function(e){ this.open(); this.filterInput.focus(); }")) 

替代方案:

$(function(){ 
    var dd = $("#ddlLocations").data("kendoDropDownList"); 
    dd.open(); 
    dd.filterInput.focus(); 
}); 

.Events(p => p.DataBound("function(e){ setTimeout(function(){ this.open(); this.filterInput.focus(); }, 500); }")) 
+0

有没有办法不先打开列表呢?仅仅因为我在ddl上面有一个可变图像,有时会在加载时有点延迟,并且根据其大小它会将控件向下移动到屏幕上。因此,最终发生的事情是打开的列表在页面上的某个点上呈现,然后图像加载并将所有内容向下推,并且打开的列表仍处于原始位置。我也不一定要打开列表,他们可能会或可能不想开始输入,他们可能会跳到下一个字段。尽管您的解决方案技术上可行。 – Cef

+0

@Cef好的搜索输入位于下拉菜单中,所以你需要先打开它,但是你可以尝试setTimeout来延迟打开,或者在文档就绪事件中调用它:'$(function(){....} )'或'成功'回调,如果它是ajax请求 –

+0

是的我注意到它不同于AJAX控件。我可以尝试使用组合框,看看它是否符合我的需求。感谢您的协助! – Cef

0

比这更容易,剑道已经有一个焦点()函数,只是做comboBox.focus()

+0

虽然这确实把焦点放在控件上,但它不允许你在没有鼠标进一步输入的情况下开始键入。 – Cef