I am trying to paginate my data with data table plugin but its pagination works for the first time only. first, its loads showing data when I click on the second page it works but after that, it doesn't. it shows processing on the top of the table here is my code.
HTML
<table id="data_table" class="display" width="100%" cellspacing="0">
<thead>
<tr>
<th><input type="checkbox" id="selectAll"/></th>
<th>Plan Name</th>
<th>Description</th>
<th>Image</th>
<th>Quantity</th>
<th>Amount</th>
<th>Action</th>
</tr>
</thead>
<tbody></tbody>
</table>
JQUERY
$("#data_table").dataTable({
"bProcessing": true,
"bServerSide": true,
"bPaginate": true,
"sAjaxSource": "response.php",
});
PHP
if(isset($_GET['iDisplayStart']))
{
$start = $_GET['iDisplayStart'];
}
else
{
$start = 0;
}
if(isset($_GET['iDisplayLength']))
{
$limit = $_GET['iDisplayLength'];
}
else
{
$limit = 10;
}
$plan = new Plan();
$result = $plan->getPlanList($limit, $start);
$count= $plan->getCountPlanList();
$myarray['recordsTotal'] = $count[0]['count(*)'];
$myarray['recordsFiltered'] = $count[0]['count(*)'];
$myarray['draw'] = intval($start/$limit)+1;
$myarray['data'] ="";
foreach($result as $data)
{
$myarray['data'][] = array('<input type="checkbox" name="selectcheck[]" class="selectcheck" value="'.$data['id'].'">',$data['name'],$data['description'],$data['image'],$data['quantity'],$data['amount'],'Edit');
}
echo json_encode($myarray);
die;
problem solved. I use sEcho value for draw on server side
$myarray['draw'] = $_GET['sEcho'];
Related
I'm trying to get my datbase fetched data to Excel file to download it in execl or csv, but I'm having problems with exporting. Not datas are fetching to the csv .Here is my code:
<div>Export to csv</div>
<form action="<?php echo $_SERVER["PHP_SELF"]; ?>" method="post" id="export-form">
<input type="hidden" value='' id='hidden-type' name='ExportType'/>
</form>
<table id="data-table" class="table table-bordered table-striped">
<thead>
<tr style="background-color: cornflowerblue;">
<th>Invoice No.</th>
<th>Invoice Date</th>
<th>Student Name</th>
<th>Total Amount</th>
</tr>
</thead>
<?php
if($total_rows > 0)
{
foreach($all_result as $row)
{
echo '
<tr>
<td>'.$row["order_no"].'</td>
<td>'.$row["order_date"].'</td>
<td>'.$row["order_receiver_name"].'</td>
<td>'.$row["order_total_after_tax"].'</td>
</tr>
';
}
}
?>
</table>
<?php
}
?>
//Add this function to script tag
function fnExcelReport()
{
var tab_text="<table border='2px'><tr bgcolor='#87AFC6'>";
var textRange; var j=0;
tab = document.getElementById('data-table'); // id of table
for(j = 0 ; j < tab.rows.length ; j++)
{
tab_text=tab_text+tab.rows[j].innerHTML+"</tr>";
//tab_text=tab_text+"</tr>";
}
tab_text=tab_text+"</table>";
tab_text= tab_text.replace(/<A[^>]*>|<\/A>/g, "");//remove if u want links in your table
tab_text= tab_text.replace(/<img[^>]*>/gi,""); // remove if u want images in your table
tab_text= tab_text.replace(/<input[^>]*>|<\/input>/gi, ""); // reomves input params
var ua = window.navigator.userAgent;
var msie = ua.indexOf("MSIE ");
if (msie > 0 || !!navigator.userAgent.match(/Trident.*rv\:11\./)) // If Internet Explorer
{
txtArea1.document.open("txt/html","replace");
txtArea1.document.write(tab_text);
txtArea1.document.close();
txtArea1.focus();
sa=txtArea1.document.execCommand("SaveAs",true,"Say Thanks to Sumit.xls");
}
else //other browser not tested on IE 11
sa = window.open('data:application/vnd.ms-excel,' + encodeURIComponent(tab_text));
return (sa);
}
I have a single php webpage where i have two result tables. I have applied TablEdit Plugins to add live Edit / Delete features.
It works perfectly ONLY when both the Tables have results, if any of them is empty, the TablEdit Plugin (Save/Delete do not appear) doesnt work.
I have separated the $(document).ready(function(){ } for each table and placing them in two different blocks. BUT same problem.
<!-- UNPAID TABLE -->
$id = $_GET ['id'];
$query = "SELECT * FROM dues INNER JOIN institutions ON institutions.id =
dues.idfk and dues.idfk ='$id' and dues.dstatus ='Unpaid'";
$data = mysqli_query($con,$query);
$total = mysqli_num_rows ($data);
if($total != 0)
{
?>
<table id="unpaid_table" class="table table-bordered">
<thead>
<tr style='text-align: center;'>
<th style='display: none;'>DID</th>
<th>Year</th>
<th>Amount</th>
<th>Penalty</th>
<th>Total Dues</th>
<th>Status</th>
</tr>
</thead>
<tbody>
<?php
while ($result = mysqli_fetch_assoc($data))
{
echo "
<tr style='text-align: center;'>
<td style='display: none;'>".$result ['did']."</td>
<td>".$result ['year']."</td>
<td>".$result['amount']."</td>
<td>".$result['penalty']."</td>
<td>".$result['total']."</td>
<td>".$result['dstatus']."</td>
</tr>";
}
}
else
{
echo "<div style='color:red;'>No Records</div>";
}
?>
</tbody>
</table>
<!-- PAID TABLE -->
$id = $_GET ['id'];
$query = "SELECT * FROM dues INNER JOIN institutions ON institutions.id =
dues.idfk and dues.idfk ='$id' and dues.dstatus ='Paid'";
$data = mysqli_query($con,$query);
$total = mysqli_num_rows ($data);
if($total != 0)
{
?>
<table id="paid_table" class="table table-bordered">
<thead>
<tr style='text-align: center;'>
<th style='display: none;'>DID</th>
<th>Year</th>
<th>Amount</th>
<th>Penalty</th>
<th>Total Dues</th>
<th>Status</th>
</tr>
</thead>
<tbody>
<?php
while ($result = mysqli_fetch_assoc($data))
{
echo "
<tr style='text-align: center;'>
<td style='display: none;'>".$result ['did']."</td>
<td>".$result ['year']."</td>
<td>".$result['amount']."</td>
<td>".$result['penalty']."</td>
<td>".$result['total']."</td>
<td>".$result['dstatus']."</td>
</tr>";
}
}
else
{
echo "<div style='color:red;'>No Records</div>";
}
?>
</tbody>
</table>
<!-- TablEdit Script -->
<script>
$(document).ready(function(){
$('#paid_table').Tabledit({
url:'duesaction.php',
columns:{
identifier:[0, "did"],
editable:[
[1, 'year'],
[2, 'amount'],
[3, 'penalty'],
[4, 'total'],
[5, 'status', '{"Paid": "Paid", "Unpaid": "Unpaid"}']
]
},
restoreButton:false,
onSuccess:function(data, textStatus, jqXHR)
{
if(data.action == 'delete')
{
$('#'+data.did).remove();
}
}
});
});
$(document).ready(function(){
$('#unpaid_table').Tabledit({
url:'duesaction.php',
columns:{
identifier:[0, "did"],
editable:[
[1, 'year'],
[2, 'amount'],
[3, 'penalty'],
[4, 'total'],
[5, 'status', '{"Paid": "Paid", "Unpaid": "Unpaid"}']
]
},
restoreButton:false,
onSuccess:function(data, textStatus, jqXHR)
{
if(data.action == 'delete')
{
$('#'+data.did).remove();
}
}
});
});
</script>
Works perfectly fine when both the Tables has data, but doesnt work if any of tables has no data.
I want it working in both the scenarios.
Please HELP.
I am trying to fetch data into a table and nothing happens.
No table appears
No data is fetched
Controller
public function indexajax()
{
if($this->input->post("action")=='FetchAllUserUingAjax')
{
$this->load->model("usersmodel");
$data["allu"]=$this->usersmodel->ShowAllUsers("users");
$data['pagetitle']=" -->All Users Using Ajax<--";
foreach ($allu as $a):
echo'<tr>
<td>'.$a->id.'</td>
<td>'.$a->username.'</td>
</tr>';
endforeach;
$this->load->view("template/admin/header",$data);
$this->load->view("users/allusersusingajax",$data);
$this->load->view("template/admin/footer");
}
}
jQuery
<script>
$(document).ready(function () {
FetchAllUserUingAjax();
function FetchAllUserUingAjax() {
$.ajax({
url:'<?php echo base_url()?>Users/indexajax',
method:"post",
success:function (data) {
$(".userdataajax table").append(data);
}
})
var action="FetchAllUserUingAjax";
$.ajax({
url:"<?php echo base_url()?>Users/indexajax",
method:"post",
data:{action:action},
success:function (data) {
$(".userdataajax table tr ").not("table tr:first").remove();
$(".userdataajax table").append(data);
Table();
}
})
}
})
</script>
Model
public function ShowAllUsers()
{
$sql=$this->db->get("users");
return $sql->result();
}
View
<div class="userdataajax table-responsive">
<table class=" table table-responsive table-bordered">
<tr>
<th>#</th>
<th>name</th>
<th>image</th>
<th> full name</th>
<th>email</th>
<th>usertype</th>
<th>status</th>
<th>reg date</th>
<th>reg time</th>
<th>delete</th>
<th>edit</th>
<th>Activate</th>
<th>disactivate</th>
</tr>
</table>
</div>
Your code hints at other relevant code that is not shown. I'm taking what you show as all that needs to be known. Here's what I see based on that premise.
First, the view. Add an id to the table. It makes JQuery selectors so much easier. The JavaScript is in this file which is "users/allusersusingajax.php".
<div class="userdataajax table-responsive">
<table id='user-table' class=" table table-responsive table-bordered">
<tr>
<th>#</th>
<th>name</th>
<th>image</th>
<th> full name</th>
<th>email</th>
<th>usertype</th>
<th>status</th>
<th>reg date</th>
<th>reg time</th>
<th>delete</th>
<th>edit</th>
<th>Activate</th>
<th>disactivate</th>
</tr>
</table>
</div>
<script>
$(document).ready(function () {
function FetchAllViaAjax() {
$.ajax({
url: '<?= base_url("users/get_all_users") ?>',
method: "post",
dataType: 'html',
success: function (data) {
var table = $("#user-table");
table.not("table tr:first").remove();//your code makes it unclear why you need this
table.append(data);
}
});
FetchAllViaAjax();
}
});
</script>
The controller needs two methods. One to show the table another to get the rows. This is the file Users.php
//show the page which includes the basic <table> and header row
public function indexajax()
{
// The code and question text give no reason for this conditional test
// So I'm removing it
//if($this->input->post("action") == 'FetchAllUserUingAjax')
//{
$data['pagetitle'] = "-->All Users Using Ajax<--";
$this->load->view("template/admin/header", $data);
$this->load->view("users/allusersusingajax");
$this->load->view("template/admin/footer");
//}
}
//respond to ajax request
public function get_all_users()
{
$this->load->model("usersmodel");
$allu = $this->usersmodel->ShowAllUsers("users");
$out = ''; //if the model returned an empty array we still have a string to echo
//using PHP's output buffer to simplify creating a big string of html
ob_start(); //start output buffering
foreach($allu as $a):
?>
<tr><td><?= $a->id; ?></td><td><?= $a->username; ?></td></tr>
<?php
endforeach;
$out .= ob_get_clean(); //append the output buffer to the $out string
echo $out;
}
Read about PHP's Output Control Functions
I'd first update my model to return an array:
return $sql->result_array();
Then in your controller, you don't need to load a view:
public function indexajax()
{
if($this->input->post("action")=='FetchAllUserUingAjax')
{
//set content type
header("Content-type: application/json");
$this->load->model("usersmodel");
echo json_encode(
$this->usersmodel->ShowAllUsers(); //this method doesn't expect an argument, no need to pass one
);
}
}
Then in your ajax callback:
success: function(resp){
$.each(resp, function(k,v){
console.log(v);
});
}
I am doing a project for my school subject. I am confused on how to do checking data's in checkbox and when I press a submit button, it will loop to insert into my database. I manage to display/alert the data that is being checked in my data-table.
Here is my Contoller where it populates my data table:
public function getalldocs() {
$listdocs = $this->Admin_model->getdoctors();
$data = array();
foreach ($listdocs as $docs) {
$row = array();
$row[] = $docs->user_fname;
$row[] = $docs->user_mname;
$row[] = $docs->user_lname;
$row[] = '<input name="user_id[]" value="'.$docs->user_id.'" type="checkbox">';
$data[] = $row;
}
$output = array(
"data" => $data,
);
echo json_encode($output);
}
Here is in my view:
<div class="dataTable_wrapper">
<table id="dataTables-docs" class="table table-striped table-bordered table-hover dataTable dtr-inline" role="grid" style="width: 100%;" width="100%" aria-describedby="dataTables-material">
<thead>
<tr>
<th>First Name</th>
<th>Middle Name</th>
<th>Last Name</th>
<th></th>
</tr>
</thead>
<tbody></tbody>
</table>
</div><!-- dataTable_wrapper -->
here is my javascript to echo the selected check box from my data-table:
function show_docs() {
$("#dataTables-docs").dataTable().fnDestroy();
table = $('#dataTables-docs').DataTable({
"ajax": {
"url": "<?php echo site_url('admin_controls/getalldocs')?>",
"type": "POST",
},
responsive: true,
className: 'select-checkbox',
'bInfo': false,
'paging': false
});
}
$('#dataTables-docs tbody').on('click', 'input[type="checkbox"]', function(e){
var user_id = $(this).val();
alert(user_id);
});
now, i want to all that is being checked to be inserted in my database like this:
(myid,selectedfromcheckbox);
here is my screenshot from database table:
Use another ajax to insert the data
$('#dataTables-docs tbody').on('click', 'input[type="checkbox"]', function(e){
var user_id = $(this).val();
$.ajax({
type:"post",
data: {user_id:user_id},
"url": "<?php echo site_url('admin_controls/saveData')?>",
success:function(data){
$("#info").html(data);
}
});
});
// Below code in you controller
public function saveData()
{
// code to save in controler
}
Here is the description of my issue:
I have a db connection here:
$host = 'some host credentials';
$dbh = 'My database';
Here is my statement:
$qry = "SELECT some_data FROM some_table LIMIT 1000";
$result = some code here;
Here is my while loop:
echo '<table class="table table-striped table-hover table-bordered" id="example">
<thead>
<tr class="test">
<th style="border: 1px solid #333;">PRODUCTPRICE</th>
<th>PRODUCTNAME</th>
<th>PRODUCTCODE</th>
<th>PRODUCTSALE</th>
<th>PRODUCTPRICE</th>
</tr>
</thead>
<tbody>';
while ($row = mysql_fetch_assoc($result)){
$PRODUCTID = intval($row["PRODUCTID"]);
$PRODUCTNAME = $row["PRODUCTNAME_1"];
$PRODUCTCODE = $row["PRODUCTCODE"];
$PRODUCTSALE = $row["PRODUCTSALE_"];
$PRODUCTPRICE = $row["PRODUCTPRICE"];
echo '<tr class="odd gradeX">
<td>'.$PRODUCTID.'</td>
<td>'.$PRODUCTNAME.'</td>
<td>'.$PRODUCTCODE.'</td>
<td class="center">'.$PRODUCTSALE.'</td>
<td class="center">'.$PRODUCTPRICE.'</td>
</tr>';
}
echo '</tbody>
</table></div>
</div>
</body>
</html>';
I want to make a loader before this content table display because there are more than 50,000 products. Something kind of processing or a circle showing that a content is loading, just a simple one, maybe jQuery or ajax. I have tried many tutorials till now but no success.
here is a scheme for that :
<div id="content"></div>
$.ajax({
url : 'the-above-script.php',
beforeSend : function() {
$("#content").html('<img src="ajax-icon-from-www.ajaxload.info">');
},
success : function(html) {
$("#content").html(html);
}
});