<input type="text" id="myInput" class="form-control" onkeyup="myFunction()" placeholder="Seach For Data..." title="Type in a name">
<table id="myTable" class="table table-bordered table-striped table-condensed cf">
<thead class="cf">
<tr id="headingTR" style="display:yes">
<th style="text-align:center">Application No.</th>
<th style="display:none;">ID</th>
<th style="width:15%;text-align:center" class="numeric">Name</th>
<th style="width:5%;text-align:center" class="numeric">Moblile No.</th>
<th style="width:45%;text-align:center" class="numeric">Detail</th>
<th style="width:10%;text-align:center" class="numeric">Tag</th>
<th style="width:5%;text-align:center" class="numeric">Status</th>
<th style="width:10%;text-align:center" >Download</th>
<th style="width:15%;text-align:center" class="numeric">Action</th>
</tr>
<tr id="noRecordTR" style="display:none">
<td>No Data</td>
</tr>
</thead>
<tbody id="data">
<?php
include("pagination/function1.php");
$page = (int) (!isset($_GET["page"]) ? 1 : $_GET["page"]);
$limit = 5; //if you want to dispaly 10 records per page then you have to change here
$startpoint = ($page * $limit) - $limit;
$sql_block = "SELECT * FROM citizen_request ORDER BY sno DESC LIMIT $startpoint, $limit";
$block_data = mysqli_query($con,$sql_block);
while($row = mysqli_fetch_assoc($block_data) ){
$id = $row['sno'];
$name = $row['name'];
$mobile = $row['mobile'];
$description = $row['description'];
$remark = $row['remark'];
$uniqueid = $row['id'];
$status = $row['status'];
$file = $row['file'];
if ($file=="")
{
$file="blank.php";
}
?>
<tr>
<td data-title="Application No"><?=$uniqueid?></td>
<td data-title="ID" style="display:none;"><?=$id?></td>
<td class="numeric" data-title="Name"><?=$name?></td>
<td class="numeric" data-title="Mobile"><?=$mobile?></td>
<td class="numeric" data-title="Detail"><?=$description?></td>
<td class="numeric" data-title="Tag"><?=$remark?></td>
<td class="numeric" data-title="Status"> <span class="badge badge-primary"><?=$status?> </span></td>
<td class="numeric" data-title="Download"><a class=" btn btn-success btn-sm" href="upload/request/<?=$file?>" target=_blank> Download</a></td>
<td class="numeric" data-title="Action">
<a href="edit-request.php?sno=<?=$id?>" onclick="return confirmation()" ><button class="btn btn-primary btn-sm"><i class="fa fa-pencil"></i></button></a>
<a href="delete_request.php?sno=<?=$id?>" onclick="return confirmation()"> <button class="btn btn-danger btn-sm"><i class="fa fa-trash-o "></i></button></a>
</td>
</tr>
<?php
$sno=$sno+1;
}
?>
</tbody>
</table>
This is my table search field. And this my script for getting the data searched by the user.
$(document).ready(function(){
$("#myInput").on("keyup", function() {
var flag = false;
var value = $(this).val().toLowerCase();
$.ajax({
url: 'getRequestSearch.php',
type: 'post',
data: {value:value},
dataType: 'json',
success:function(response){
var len = response.length;
if(len == 0){
} else{
var data = "";
var sno = 1;
for( var i = 0; i<len; i++){
var id = response[i]['id'];
var name = response[i]['name'];
var mobile = response[i]['mobile'];
var description = response[i]['description'];
var remark = response[i]['remark'];
var app_no = response[i]['app_no'];
var status = response[i]['status'];
var file = response[i]['file'];
if(file==""||file=="no")
{
file="blank";
}else
{
}
if(id=="")
{
}
else
{
data += '<tr><td data-title="Application No.">' + app_no + '</td><td data-title="ID" style="display:none;">' + id + '</td> <td class="numeric" data-title="Name">' + name + '</td><td class="numeric" data-title="Mobile">'+ mobile + '</td><td class="numeric" data-title="Description">'+ description +'</td><td class="numeric" data-title="Remark">' +remark+ '</td><td class="numeric" data-title="Status"><span class="badge badge-primary">'+ status +'</span></td> <td class="numeric" data-title="Download"><a class=" btn btn-success btn-sm" href="upload/request/'+file+'" target=_blank>Download</a></td><td class="numeric" data-title="Operation"><a href="edit-request.php?sno='+id+'" onclick="return confirmation()" ><button class="btn btn-primary btn-sm"><i class="fa fa-pencil"></i></button></a><a href="delete_request.php?sno='+id+'" onclick="return confirmation()"> <button class="btn btn-danger btn-sm"><i class="fa fa-trash-o "></i></button></a></td></tr>';
}
sno++;
$("#download-excel").attr("href", "excel-request.php?status="+status_sel+"");
$("#download-excel").attr("target","_blank");
$("#download-zip").attr("href", "download-zip-request.php?status="+status_sel+"");
$("#download-zip").attr("target","_blank");
}
$("#data").html(data)
}
}
});
});
});
As i Enter name it is getting the data in response according to what i type in the search field.. but table data isnt changing. And also m using WHERE name LIKE %$value%; but how can i search for multiple columns or all column.
Advertisement
Answer
$(document).ready(function(){
$("#myInput").on("keyup", function() {
var flag = false;
var value = $(this).val().toLowerCase();
$.ajax({
url: 'getRequestSearch.php',
type: 'post',
data: {value:value},
dataType: 'json',
success:function(response){
var len = response.length;
if(len == 0){
} else{
var data = "";
var sno = 1;
for( var i = 0; i<len; i++){
var id = response[i]['id'];
var name = response[i]['name'];
var mobile = response[i]['mobile'];
var description = response[i]['description'];
var remark = response[i]['remark'];
var app_no = response[i]['app_no'];
var status = response[i]['status'];
var file = response[i]['file'];
if(file==""||file=="no")
{
file="blank";
}else
{
}
if(id=="")
{
}
else
{
data += '<tr><td data-title="Application No.">' + app_no + '</td><td data-title="ID" style="display:none;">' + id + '</td> <td class="numeric" data-title="Name">' + name + '</td><td class="numeric" data-title="Mobile">'+ mobile + '</td><td class="numeric" data-title="Description">'+ description +'</td><td class="numeric" data-title="Remark">' +remark+ '</td><td class="numeric" data-title="Status"><span class="badge badge-primary">'+ status +'</span></td> <td class="numeric" data-title="Download"><a class=" btn btn-success btn-sm" href="upload/request/'+file+'" target=_blank>Download</a></td><td class="numeric" data-title="Operation"><a href="edit-request.php?sno='+id+'" onclick="return confirmation()" ><button class="btn btn-primary btn-sm"><i class="fa fa-pencil"></i></button></a><a href="delete_request.php?sno='+id+'" onclick="return confirmation()"> <button class="btn btn-danger btn-sm"><i class="fa fa-trash-o "></i></button></a></td></tr>';
}
sno++;
$("#download-excel").attr("href", "excel-request.php?status="+status"");
$("#download-excel").attr("target","_blank");
$("#download-zip").attr("href", "download-zip-request.php?status="+status"");
$("#download-zip").attr("target","_blank");
}
$("#data").html(data)
}
}
});
});
});
Only thing i see is status_sel not defined.. now it should work