【问题标题】:Autocomplete - Modifying the selected and set item自动完成 - 修改选定和设置的项目
【发布时间】:2013-05-26 00:24:17
【问题描述】:

我有一个自动完成功能如下:

$('#' + id).autocomplete({
                minLength: minLength,
                source: function (d, cb) {
                 ...

                }

               // select event of ocr number autocomplete
                select: function (evt, item) {
                ...
                // set ocr number
                    var inputValue = item.item.value; //0033-ABCDEF
                    var tempArr = inputValue.split('-'); 
                    inputValue = tempArr[0]; // 0033
               ...

              }
        });

输入:0033 自动完成列表出现 - 0033-ABCDEF(第一个结果)

当我选择 0033-ABCDEF 时通过自动完成设置 Vaue,但我需要 0033

我知道这是自动完成的默认属性,但需要在 select() 上覆盖它以给出拆分结果。

提前致谢!!!

-- 好啦

【问题讨论】:

  • 说实话,我不明白你的情况。你能改写你的问题或添加一个例子吗?
  • 这是否有意义或问我具体问题以澄清......
  • 那么你是说它后面的整个列表应该显示例如 0033,这应该意味着 0033-ABCDEF,或者你是说如果他们输入 0033,列表应该显示 0033,但如果他们保留像 0033-AB 这样输入现在应该显示 0033-AB?在您的问题中包含正在加载的数据可能会有所帮助。
  • 不...不要去加载列表..列表应该像我显示的那样加载(如果我输入 0033 - 它带有丢失的起始 0033-ABCD)。我的问题是我想将其设置为 0033('-' 之前的拆分值),但自动完成具有默认属性,它将设置与列表中选择的值相同的值,即 0033-ABCD 但我想拆分并仅设置 0033 . 有可能吗?
  • 我的查询清楚吗?

标签: jquery html autocomplete


【解决方案1】:

试试这个:

$('#' + id)
    .autocomplete({
        minLength: minLength, 
        source: function(d, cb) {
            ...
        }
        // select event of ocr number autocomplete
        select: function(evt, item) {
            // set ocr number
            var inputValue = item.item.value; //0033-ABCDEF
            var tempArr = inputValue.split('-');
            inputValue = tempArr[0]; // 0033

            $(this).val(inputValue); // Sets the value manually in the text field

            return false; // Prevent default behaviour
        }
    });

【讨论】:

  • 这是最好的方法吗...我想到了一些自动完成的方法,我们可以覆盖它来实现这个...
  • 它有什么问题?现在,如果您可以控制数据源,您可以定义labelvalue,就像这里描述的api.jqueryui.com/autocomplete/#option-source 一样。您的来源看起来像 source: [ { label: "0033-ABCDEF", value: "0033" }, ... ]
猜你喜欢
  • 2021-10-25
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2020-03-24
  • 1970-01-01
  • 1970-01-01
  • 2011-09-05
相关资源
最近更新 更多