DataTables上的范围日期搜索（CodeIgniter）

Question

I need help. I want to show the data's within the range of the date i choose. Here's my code so far

Here's the code where I display the datatables

View

<div class="box-body">
          <div class="table-responsive">

              <div class="row">
                <div class="col-md-4">
                  <div class="form-group start-date">
                    <label>From</label>
                    <div class="input-group date">
                      <div class="input-group-addon">
                        <i class="fa fa-calendar"></i>
                      </div>
                      <input type="text" class="form-control pull-right" id="start_date" name="start_date">
                    </div>
                    <!-- /.input group -->
                  </div>
                </div>
                <div class="col-md-4">
                  <div class="form-group end-date">
                    <label>To</label>
                    <div class="input-group date">
                      <div class="input-group-addon">
                        <i class="fa fa-calendar"></i>
                      </div>
                      <input type="text" class="form-control pull-right" id="end_date" name="end_date">
                    </div>
                    <!-- /.input group -->
                  </div>
                </div>
                <div class="col-md-2">
                  <div class="form-group met-cheq">
                      <label>Go </label>
                      <div class="input-group date">
                        <button class="btn btn-warning btn-md" name = "search" id="search">Search!</button> 
                      </div>
                      <!-- /.input group -->
                  </div>
                </div>
              </div>


            <table id="table-sales" class="table table-bordered table-striped">
              <thead>
                <tr>
                  <th>DR</th>
                  <th>Date</th>
                  <th>Customer</th>
                  <th>Price</th>
                  <th>Paid Amnt</th>
                  <th>Balance</th>
                  <th>Receipt</th>
                  <th>Remarks</th>
                  <th>Items</th>
                  <th style="width:55px;">Action</th>
                </tr>
              </thead>
              <tbody>
                <?php foreach ($sales_inv as $inv) {
                    $balance = $inv->inv_price-$inv->payment;
                    $status = "";
                    $payment = $inv->payment;

                    if ($inv->inv_type==1) {
                      $status = "Department Store";
                    }elseif($inv->inv_type==2){
                      $status = "Local";
                    }elseif($inv->inv_type==3){
                      $status = "Provincial";
                    }elseif($inv->inv_type==4){
                      $status = "UNITOP";
                    }elseif($inv->inv_type==5){
                      $status = "GAISANO";
                    }
                ?>
                  <tr class="row-<?php echo $inv->id; ?>">
                    <td><a href="#" class="btn-inv-show" data-value="<?php echo $inv->inv_cno; ?>@<?php echo $inv->id; ?>"><?php echo $inv->inv_cno; ?></a></td>
                    <td><?php echo date("M d, Y", strtotime($inv->timestamp)); ?></td>
                    <td><?php echo $inv->cust_name; ?></td>
                    <td class="price-<?php echo $inv->inv_cno; ?>">Php <?php echo number_format($inv->inv_price,2); ?></td>
                    <td class="payment-<?php echo $inv->inv_cno; ?>">Php <?php echo number_format($payment,2); ?></td>
                    <td class="bal-<?php echo $inv->inv_cno; ?>">Php <?php echo number_format($balance,2); ?></td>
                    <td><?php echo $status; ?></td>
                    <td>
                      <button class="btn btn-info btn-sm btn-rem" data-value="<?php echo $inv->id; ?>">View Remarks
                      </button>
                    </td>
                    <td>
                      <button class="btn btn-success btn-sm btn-item" data-value="<?php echo $inv->inv_cno; ?>">View Item
                      </button>
                    </td>
                    <td>
                      <button class="btn btn-primary btn-xs btn-print" data-value="<?php echo $inv->inv_cno; ?>"><i class="fa fa-print"></i></button>
                      <button class="btn btn-warning btn-xs btn-add-pay" data-value="<?php echo $inv->inv_cno; ?>@<?php echo $inv->custid; ?>@<?php echo $inv->id; ?>"><i class="fa fa-credit-card"></i></button>
                      <button class="btn btn-danger btn-xs btn-edit-pay" data-value="<?php echo $inv->inv_cno; ?>@<?php echo $inv->custid; ?>@<?php echo $inv->id; ?>"><i class="fa fa-edit"></i></button>
                    </td>
                  </tr>
                <?php } ?>
              </tbody>
              <tfooter>
                <tr>
                  <th>DR</th>
                  <th>Date</th>
                  <th>Customer</th>
                  <th>Price</th>
                  <th>Paid Amnt</th>
                  <th>Balance</th>
                  <th>Receipt</th>
                  <th>Remarks</th>
                  <th style="width:55px;">Action</th>
                </tr>
              </tfooter>
            </table>
          </div>
          <!-- /.table-responsive -->
        </div>
      </div>
      <!-- /.box -->
    </section>
    <!-- right col -->
  </div>

Model

public function rangeDate($start_date,$end_date){

    $query = $this->db->select($this->tables['invent_inv'].'.id,'
    .$this->tables['invent_inv'].'.inv_type,'.$this->tables['invent_inv'].'.inv_cno,'
    .$this->tables['invent_cust'].'.id as custid,'.$this->tables['invent_cust'].'.cust_name,'
    .$this->tables['invent_inv'].'.inv_price, '.$this->tables['invent_inv'].'.inv_tax,'
    .$this->tables['invent_inv'].'.pay_due, SUM('.$this->tables['invent_sales'].'.paid_amnt) as payment,'
    .$this->tables['invent_inv'].'.timestamp')
        ->join($this->tables['invent_cust'], $this->tables['invent_inv'].'.cust_id='
    .$this->tables['invent_cust'].'.id','LEFT')
        ->join($this->tables['invent_sales'], $this->tables['invent_inv'].'.inv_cno='
    .$this->tables['invent_sales'].'.inv_cno','LEFT')
        ->where($this->tables['invent_inv'].'.status !=', 1)
        ->where($this->tables['invent_inv'].'.status !=', 0)
        ->where($this->tables['invent_inv'].'.timestamp >=',$start_date)
        ->where($this->tables['invent_inv'].'.timestamp <=',$end_date)
        ->group_by($this->tables['invent_sales'].".inv_cno")
        ->group_by($this->tables['invent_inv'].".inv_cno")
        ->group_by($this->tables['invent_inv'].".timestamp")
        ->get($this->tables['invent_inv']);

    return $query;
}

JS

$('#start_date').datepicker({
  dateFormat: 'yy-mm-dd',
  autoclose: true
})

$('#end_date').datepicker({
  dateFormat: 'yy-mm-dd',
  autoclose: true
})

$('#table-sales').DataTable();

Now my problem is that I don't know what to put on the controller and I don't know how to show it on my table-sales . I don't know if the code I am putting is correct or if I am on the right path . I'm using codeigniter3x . Could someone help me please.

Thank you in advance for someone who will help me .

Answer 1

1. You can call ajax when click on Search button and pass start and end date as parameters in ajax request and filter data.

2. After get ajax response from controller you can update tbody of table-sales table using jquery with updated data. Example Assume you get array of updated data var tab_body = '';

       $.each(sub_subject, function (key, value)
       {
           tab_body = tab_body + '<tr><td>' + value.sub_subject_name + '</td>' +
                   '<td>' + value.sub_subject_code + '</td>' +
                   '<td><div class="text-center"><button class="btn btn-primary open_edit_sub_subject_model"  sub_subject_id="' + value.sub_subject_id + '"  type="button" title="Edit" request_type="open_edit" subject_name="' + d.subject_name + '"><i class="fas fa-edit"></i></button>
   \
                    <button type="button" class="btn btn-primary subject-data-delete" title="Remove" delete_type="sub_subject" subject_group_id="' + d.subject_group_id + '" subject_id="' + d.subject_id + '" sub_subject_id="' + value.sub_subject_id + '"><i class="fa fa-trash"></i></button>
   \
                    </div></td>' +
                   '</tr>';
       });
       // example is just for reference
       put above data in table using
       $("#table-sales tbody").html(tab_body);
   

   Hopfully it will help.