Laravel 8 데이터베이스에서 자동 완성 검색
그럼 라라벨 8에서 자동완성 검색, ajax를 이용한 자동완성 검색, 자동완성 검색 예제, 라라벨 8에서 ajax 자동완성 텍스트박스를 살펴보겠습니다.
한 번에 테이블에 더 많은 데이터가 있는 경우 데이터베이스에서 데이터를 가져오는 데 더 많은 시간이 걸리기 때문에 드롭다운 상자를 제공할 수 없습니다. 그래서 여기서 우리는 ajax를 사용하여 자동 완성 검색을 추가할 것입니다.
1단계: 경로 추가
여기서는 laravel에서 이 자동 완성 검색 예제에 대한 경로 파일에 경로 메서드를 추가했습니다.
<?php
use Illuminate\Support\Facades\Route;
use App\Http\Controllers\UserController;
Route::get('/', function () {
return view('welcome');
});
Route::get('search', [UserController::class, 'search']);
Route::get('autocomplete', [UserController::class, 'autocomplete'])->name('autocomplete');
Read Also : Load More Data in Laravel Using Ajax jQuery
2단계: 컨트롤러 만들기
이제 이 예제를 위해 이미 UserController를 생성했습니다. 따라서 요구 사항에 따라 컨트롤러를 만들고 컨트롤러에 아래 코드를 추가할 수 있습니다.
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\User;
use DB;
class UserController extends Controller
{
public function search()
{
return view('user');
}
public function autocomplete(Request $request)
{
$data = User::select("name")
->where("name","LIKE","%{$request->str}%")
->get('query');
return response()->json($data);
}
}
Read Also : Autotab To Next Input Field JQuery Example
3단계: 블레이드 파일 생성
마지막 단계에서는 출력 보기를 위한 user.blade.php 파일을 생성합니다.
<!DOCTYPE html>
<html>
<head>
<title>Laravel 8 Autocomplete Search from Database - Techsolutionstuff</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-3-typeahead/4.0.1/bootstrap3-typeahead.min.js"></script>
</head>
<body>
<div class="container">
<h2 style="margin: 30px 0px; text-align: center;">Laravel 8 Autocomplete Search from Database - Techsolutionstuff</h2>
<input class="search form-control" type="text" placeholder="Search here...">
</div>
<script type="text/javascript">
var path = "{{ route('autocomplete') }}";
$('input.search').typeahead({
source: function (str, process)
{
return $.get(path, { str: str }, function (data) {
return process(data);
});
}
});
</script>
</body>
</html>
다음을 좋아할 수도 있습니다.
Reference
이 문제에 관하여(Laravel 8 데이터베이스에서 자동 완성 검색), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://dev.to/techsolutionstuff/laravel-8-autocomplete-search-from-database-33dc텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
좋은 웹페이지 즐겨찾기
