aralejs / autocomplete Goto Github PK

使用.set('disabled', true)之后，貌似没禁用完全，键盘事件还是在监听。

场景：
http://www.aliexpress.com/ 的搜索框

问题：
输入一个字母后离开输入框，再次focus输入框时候需要立即展现之前的联想框体

目前实现：

setup :function() {
    var _self = this;
    xxxxxx.superclass.setup.call(_self);            
    this.get('trigger').focus(function(){
        if(this.value !== "" && _self.get('data').length !== 0){
            _self.show();
        }
    });
}

之前修改了刷新频率的值，但是 ajax 请求发送的还是太频繁，如果设置过长，会有明显的延时。

两者很难折中，所以就提供属性配置。

输入不匹配的时候现在仍然显示

应该将模版清空并隐藏

<div class="{{prefix}}">
    <ul class="{{prefix}}-ctn" data-role="items">
        {{#each items}}
            <li data-role="item" class="{{../prefix}}-item" data-value="{{value}}">{{highlightItem ../prefix}}</li>
        {{/each}}
    </ul>
        {{items.length}}
</div>

items.length 返回为 0

<div class="{{prefix}}">
    <ul class="{{prefix}}-ctn" data-role="items">
        {{items.length}}    
        {{#each items}}
            <li data-role="item" class="{{../prefix}}-item" data-value="{{value}}">{{highlightItem ../prefix}}</li>
        {{/each}}
    </ul>

</div>

items.length 返回正确

测过 handlebars，应该不是这个的问题。

可以看autocmplete的过滤器的例子中的输入过滤，如果把输入框中[email protected]中的a删除后在输入一个a后，光标会移动到最后的位置。

数据源：['abc', 'abd']

按回车选择 abc，再次点击下键还是 ['abc', 'abd']，应该只显示 abc。

textarea 回车的时候是换行而不是提交，submitOnEnter 属性对这种场景意义不大，想想如何对这种场景做特殊处理。

如题

每次按键都会触发查询流程，现在通过 delay 控制入口，但是如果已经进入数据查询后就不能阻止了。

dataSource 提供 abort 方法可能阻止数据查询，主要是 ajax 的异步查询。

现在 callback 返回两个值

.on('itemSelect', function(text, data) {

})

text 的值在 data 中也存在，text 没有存在的必要

如题，这个时候，文本框无法输入换行。

RT

当选中某一项时，输入框的焦点会移向浮层，这时会触发 blur 事件，blur 优先于 click，浮层隐藏了就无法选中

现在是 400ms 后再触发的处理方式，想想有没有更好的

dataSource 获取的数据

[
    {title:'a', name:'b'},
    {title:'c', name:'d'},
]

在选择某项后仍然希望获取 title 和 name，显示和选择的值不同。

由于部分业务可能会占用回车事件（比如注册keydown事件监测Enter）。需要通过TAB键也能选中项。

向右移动，浮层消失；向左移动，浮层不会消失。

• itemEnter
• itemLeave

简单数据的时候，filter默认为'startsWith'，而在异步获取数据的情况下，应该默认为filter:''

用户输入的值可能不是 filter 想要的，有时候还要进行处理，增加 inputFilter 参数。

textarea 一般不是全文 complete，所以要根据光标的位置插入文本。

input 框中上下按键会到输入框的最左和最右，如果不阻止感觉体验不好。

textarea 框上下按键是选中不同的行，如果阻止就无法上下移动。

现在 input 默认阻止，textarea 要覆盖的话有很多代码重复。

如题

如果提供的相对路径 / ./ getData.json，用 ajax get 请求

如果为 http:// https:// 则用 jsonp

提供触发补全的最短/最长支付数

'./data.json?query={{query}}'

query 值需要被编码成 utf-8，而不是根据页面的编码。

支持可编辑的HTML容器

如果是 textarea，下拉层希望出现在光标下面，而不是输入框下面。

如果 ajax 的数据，按键频率太快会频繁的去请求

disabled = true 则不再进行补完的操作。

是否显示的判断是同步执行的，如果异步获取数据，那么在之前已经执行了。

当用户在js未运行前就键入内容就无法显示了，建议增加配置使控件初始化完即根据value展开。

这个是选bug还是enhancement呢？

看到新更新的autocomplete在ajax下把filter拿走了 这个原来作为兼容老接口方案是有用的
例如我们的数据返回需要经过重新组织才能使用。

默认选中第一个，按回车就可直接选择

回车时要选中某一项，要确定是否要提交表单

• ✔ Autocomplete -> AutoComplete

• ✔ 按照事件命名规范：驼峰

• ✔ resultsLocator 默认值为 data，用户约定

  resultsLocator 改成任何类型都支持

• ✘ dataReturn 事件，数据返回的时候可以处理

  filter 处理完后就渲染页面了，没必要再加中间步骤了

• 参考一下 kissy 的 suggest

• ✔ 输入框的回车后会提交表单 #2

• ✔ circular 去掉，默认循环

现在缺少文字提示，内容较少

如题

现在的逻辑是 data 返回空数组就不显示，但有的时候在没数据的时候要显示“无结果”等文案。

希望这种情况只要改模板就好了。

从 autocomplete 独立出来，textarea-complete.js

• #12 光标跟随
• #34 输入框事件处理
• #36 selectItem 处理
• #40 上下按键的交互

demo里面ui-autocomplete-item-hl样式缺失 看不到效果啦

input 变化会触发获取数据、过滤、渲染的流程，选中某项后 input 也发生变化了，但不应该在走这个流程

keydown 在 keyup 之前，所以回车后还是会触发 keyup，这导致回车选中某项时还会触发 keyup，如果内容有变化还会再次显示。

所以在操作键后不再触发 keyup。

ebf95a2

之前把 blur 去掉了，还得考虑下更好的方法。