簡體   English   中英

Laravel5中的jQuery Autocomplete不起作用

[英]jQuery Autocomplete in Laravel5 not working

這是基本代碼。 我似乎無法在Laravel 5中使用它:

routes.php

Route::get('h2h', 'atp_players\H2hController@getIndex');
Route::get('h2h_getdata', 'atp_players\H2hController@getData');

H2hController.php

namespace Atpstats\Http\Controllers\atp_players;
use Atpstats\Http\Controllers\Controller;
use Response;
use Request;


class H2hController extends Controller{

public function getIndex() {
    return view('atp_players.h2h');
}

public function getData() {
    $term =  Request::input('auto', 'r');

    $results = \DB::table('atp_players')->select('firstname')->get();
    $data = array();

    foreach($results as $result) {

         if(strpos($result,$term) !== false) {
            $data[] = ['value' => $result->firstname];
        }
    }
    return Response::json($data);
}
}

查看:h2h.blade.php

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>jQuery UI Autocomplete test</title>
    <link rel="stylesheet" href="//code.jquery.com/ui/1.11.3/themes/smoothness/jquery-ui.css">
    <script src="//code.jquery.com/jquery-1.10.2.js"></script>
    <script src="//code.jquery.com/ui/1.11.3/jquery-ui.js"></script>
    <link rel="stylesheet" href="/resources/demos/style.css">
</head>
<body>
<div class="container">
<div class="ui-widget">
    <label for="">Find a player</label>
    <input type="text" class="form-control input-sm" name="auto" id="auto"  autocomplete="on">
</div>
<div class="form-group">
    <label for="">Response</label>
    <input type="text" class="form-control input-sm" name="response" id="response" disabled>
</div>

<script>
    $('#auto').autocomplete({
        type: "get",
        source: 'h2h_getdata',
        dataType: "json",
        minLength: 1,
    select:function(e,ui){
    $('#response').val(ui.item.value);
}
});

</script>
</body>
</html>

沒用 當您在輸入文本案例中編寫內容時,它什么也不做。 但是,如果我在Controller中注釋了幾行,則會顯示數據庫的數據(名字),但自動完成功能不起作用。

這就是修改后的Controller函數:

public function getData() {
    //$term =  Request::input('auto', 'r');

    $results = \DB::table('atp_players')->select('firstname')->get();
    $data = array();

    foreach($results as $result) {

         //if(strpos($result,$term) !== false) {
            $data[] = ['value' => $result->firstname];
        //}
    }
    return Response::json($data);
}

我認為問題可能出在服務器端代碼上。 嘗試將表單項名稱從“ auto”更改為“ term”,如下所示:

...
public function getData() {
$term =  Request::input('term', 'r');
...

有關更多信息,請訪問http://api.jqueryui.com/1.10/autocomplete/#option-source

嘿,我認為另一個人在正確的軌道上。 問題出在您的源json。 您正在打印格式正確的JSON,只需將其放在正確的密鑰對中即可自動完成。 根據source屬性的Jquery UI自動完成文檔,如果您要使用數組,則必須使用label:value:正確設置其格式value:

所以只需格式化數據

public function getData() {
//$term =  Request::input('auto', 'r');
$results = [['firstname' => 'Edwardo', 'ID' => '12'], ['firstname' => 'Edwarda', 'ID' => '13']];
//$results = \DB::table('atp_players')->select('firstname')->get();

$data = array();

foreach($results as $result) {

     if(strpos($result,$term) !== false) {
        $temp = array();
        // This is what will be displayed by autocomplete
        $temp['label'] = $result->firstname;
        // This will be the value you get back through form (eg: User_ID)
        $temp['value'] = $result->ID;
        array_push($data, $temp);
    }
}
return Response::json($data);

}

這是一個工作的小提琴,其中的json數組已預先填寫https://jsfiddle.net/7u73czt8/

但是,如果您只想搜索它,也可以只給它一個值,它將提交名字作為輸入標簽值。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM