提前输入不显示第二次输入的任何结果

时间:2019-01-01 19:17:08

标签: javascript ajax laravel typeahead.js

我正在为两个输入使用Typeahead,我让它可用于第一个输入,但对于第二个输入却不起作用,我不确定这里是什么问题,为什么不起作用,我更改了ID一切,但该请求根本没有显示任何详细信息。

这是我的create.blade.php

@csrf

    <div class="col-xs-12 col-sm-12 col-md-12">
        <div class="form-group">
            <strong>Customer Name:</strong>
          <input class="form-control" autocomplete="off" type="text" name="customer_id" id='cust' onkeypress="myFunction()" placeholder="Customer Name">
        </div>
        <div class="form-group">
            <strong>Card Number:</strong>
            <input class="form-control" type="text" name="customer_id" id='card' onkeypress="myFunction1()" placeholder="Customer Name">
          </div>
<script>
function myFunction()
{
  var path = "{{ route('autocomplete') }}";
  $('#cust').typeahead({
    name: 'cust',
      source:  function (query, process) {
      return $.get(path, { query: query }, function (data) {

              return process(data);
          });
      }
  });
}
function myFunction1()
{

  var path = "{{ route('autocompletecard') }}";
  $('#card').typeahead({
    name: 'card',
      source:  function (query, process) {
      return $.get(path, { query: query }, function (data) {
              return process(data);
          });
      }
  });
}
</script>

控制器:

public function autocomplete(Request $request)
          {
              $data = Customer::select("name")
                      ->where("name","LIKE","%{$request->input('query')}%")
                      ->get();

              return response()->json($data);
          }
          public function autocompletecard(Request $request)
              {
                  $data = Card::select("cardno")
                          ->where("cardno","LIKE","%{$request->input('query')}%")
                          ->get();

                  return response()->json($data);
              }

web.php:

Route::get('autocomplete', 'AssigneeController@autocomplete')->name('autocomplete');
Route::get('autocompletecard', 'AssigneeController@autocompletecard')->name('autocompletecard');

1 个答案:

答案 0 :(得分:0)

您的浏览器可能不喜欢为自动完成元素自动添加的TypeAhead。尝试将autocomplete="off"手动添加到第二个输入中。您可以检查添加了什么TypeAhead-查看您的源代码。它可能不适用于FF,但可能适用于Chrome。浏览器对此很挑剔。

可以尝试:

<input class="form-control" autocomplete="off" type="text" name="customer_id" id='card' onkeypress="myFunction1()" placeholder="Customer Name">

或者,尝试使用autocomplete =“ false”。 Chrome有时会避开'off'。