Typeahead TypeError: it.toLowerCase is not a function

Question

美好的一天。请先看看我的脚本。

我的JS

$(document).ready(function(){    
    $("#outlet").typeahead({
         source: function(query, process) {

                $.ajax({
                 url: '<?=base_url();?>graph/outletlists',
                 data: {outlets:$("#outlet").val()},
                 type: 'POST',
                 dataType: 'JSON',
                 success: function(data) {
                          process(data);
                          console.log(data);
                        }               
                    });
         },
        minLength: 2
    });
});

我的控制器

function outletlists()
    {
        extract(populateform());
        $hasil = $this->modelmodel->showdata("SELECT Outlet from transaksi where outlet like '%".$outlets."%' group by Outlet");
        echo json_encode($hasil);
    }

和我的表格

 <div class="form-group">
         <label class="col-sm-3 control-label">Outlet</label>
              <div class="col-sm-5">
                   <input type="search" id="outlet" class="form-control" placeholder="Search..." data-provide="typeahead" />
              </div>
   </div>

所以，我正在使用 Bootstrap3-typeahead。从我上面的脚本我得到了这个错误

来自 console.log(data) 我已经有了我想要的结果。所以我的问题是我看不到任何建议，然后我从 firebug

得到了这个错误

return ~it.toLowerCase().indexOf(this.query.toLowerCase());

这是我输入AR

时得到的结果

[{"Outlet":"K-AR3"},{"Outlet":"K-AR4"},{"Outlet":"K-ARN2"},{"Outlet":"K-ARN3"}]

任何帮助将不胜感激，抱歉我的英语不好。

我试着让它像 http://twitter.github.io/typeahead.js/examples/

中的例子

var states = ['Alabama', 'Alaska', 'Arizona', 'Arkansas', 'California',
  'Colorado', 'Connecticut', 'Delaware', 'Florida', 'Georgia', 'Hawaii',
  'Idaho', 'Illinois', 'Indiana', 'Iowa', 'Kansas', 'Kentucky', 'Louisiana',
  'Maine', 'Maryland', 'Massachusetts', 'Michigan', 'Minnesota',
  'Mississippi', 'Missouri', 'Montana', 'Nebraska', 'Nevada', 'New Hampshire',
  'New Jersey', 'New Mexico', 'New York', 'North Carolina', 'North Dakota',
  'Ohio', 'Oklahoma', 'Oregon', 'Pennsylvania', 'Rhode Island',
  'South Carolina', 'South Dakota', 'Tennessee', 'Texas', 'Utah', 'Vermont',
  'Virginia', 'Washington', 'West Virginia', 'Wisconsin', 'Wyoming'
];
$(document).ready(function() {
    $("#outlet").typeahead({
        autoSelect: true,
        minLength: 2,
        delay: 400,
        source: states
    });
});

而且有效。

结果来自 firebug

POST http://localhost:84/new_store/graph/outletlists 200 OK 375ms
jquery-....min.js (line 4) HeadersPostResponseHTMLCookies

[{"Outlet":"K-AR3"},{"Outlet":"K-AR4"},{"Outlet":"K-ARN2"},{"Outlet":"K-ARN3"}]

TypeError: b.toLowerCase is not a function

...on(a){var b=this.displayText(a);return~b.toLowerCase().indexOf(this.query.toLowe...

bootstr....min.js (line 1, col 2903

我尝试将我的 bootstrap3-typeahead.js 更改为 bootstrap3-typeahead.min.js 结束我的错误变成这样

TypeError: b.toLowerCase is not a function ...on(a){var b=this.displayText(a);return~b.toLowerCase().indexOf(this.query.toLowe...

Answer 1

尝试将以下示例用作静态代码，然后将其动态化示例：http://twitter.github.io/typeahead.js/examples/.

Answer 2

正如我从您的 console.log() 中看到的那样。你明白了。

[{"Outlet":"K-AR3"},{"Outlet":"K-AR4"},{"Outlet":"K-ARN2"},{"Outlet":"K-ARN3"}]

你只需要

[{"K-AR3"},{"K-AR4"},{"K-ARN2"},{"K-ARN3"}]

所以尝试将控制器更改为

function outletlists()
    {
        extract(populateform());
        $hasil = $this->modelmodel->showdata("SELECT Outlet from transaksi where outlet like '%".$outlets."%'  group by Outlet");
        $data = array();
        foreach ($hasil as $hsl)
            {
                $data[] = $hsl->Outlet;
            }
        echo json_encode($data);
    }

Answer 3

即使有一个已被接受的答案，我也会提供另一个答案，因为这个答案不适用于我的情况。原来我的数组元素之一是空值。所以我重写了我的数据查询以过滤掉空值。

Typeahead TypeError: it.toLowerCase is not a function

Typeahead TypeError: it.toLowerCase is not a function

jquery

ajax

twitter-bootstrap

codeigniter-3