I have finished writing the code to search for members and their specialties and I am taking my data from the database
I faced a problem in entering the search as it does not give me correct results from the search and I noticed that the Arabic language is not supported in the search when I enter.
Knowing that the search is open and there are no search conditions. If the search result matched, show me the result .
functions.js
import $ from 'jquery';
// Search functionality
$(document).ready(function() {
// Attach keyup event listener to the search input
$("#searchInput").on("keyup", function() {
// Get the current value of the input and convert it to lowercase
var value = $(this).val();
// Filter the table rows based on the input value
$("#tableBody tr").filter(function() {
// Toggle the visibility of the row based on whether it contains the search value
$(this).toggle($(this).text().indexOf(value) > -1);
});
});
});
members.blade.php
<input class="form-control mb-3" id="searchInput" type="text" placeholder="Search...">
<!-- Table with Search and Filter -->
<div class="table-container">
<table class="table table-bordered">
<thead>
<tr>
<th scope="col">ID</th>
<th scope="col">Name</th>
<th scope="col">role</th>
</tr>
</thead>
<tbody id="tableBody">
@foreach($members $member)
<tr>
<th scope="row">{{ $member->id }}</th>
<td>{{ $member->name ?? 'no data'}}</td>
<td>{{ $member->role->name ?? 'no data'}}</td>
<td>
<button @click="UpdateMember = true; currentMember = {{ $member->toJson() }}" class="bg-green-500 text-white px-4 py-2 rounded">تعديل</button>
<!-- <a href="'member.edit', $member->id) " class="btn btn-primary">Edit</a> -->
<form action="{{ route('member.destroy', $member->id) }}" method="POST" style="display: inline-block;">
@csrf
@method('DELETE')
<button type="submit" class="btn btn-danger">حذف</button>
</form>
</td>
</tr>
</tbody>
@endforeach
</table>
</div>