DataTable checkbox

DataTable checkbox

portfoxportfox Posts: 1Questions: 1Answers: 0

I have been hunting high and low for an answer for this one, thanks fully I'm closer than ever before thanks to this forum. But, still having an issue. The filter data by text field is fine and working, I'd like to add an option to filter the 'Status' field if possible.
My code has an array, so I'm stuck, my code is below, any suggestions would be great. Thanks in advance.

<?php include'db_connect.php' ?>

<div class="col-lg-12">
    <div class="card card-outline card-success">

        <div class="card-header">
            <?php if($_SESSION['login_type'] != 3): ?>
            <div class="card-tools">
                <a class="btn btn-block btn-sm btn-default btn-flat border-primary" href="./index.php?page=new_project"><i class="fa fa-plus"></i> Add New project</a>
            </div>
            <?php endif; ?>
        </div>
        <div class="card-body">
            <div id="status">
                <input id="filter2" type="checkbox" value="Done" checked="">Filter 'Done' Complete Projects
           </div>
            <table class="table tabe-hover table-condensed" id="list">
                <colgroup>
                    <col width="5%">
                    <col width="35%">
                    <col width="15%">
                    <col width="15%">
                    <col width="15%">
                    <col width="10%">
                </colgroup>
                <thead>
                    <tr>
                        <th class="text-center">#</th>
                        <th>Project Name</th>
                        <th>Date Started - Received</th>
                        <th>Close of Tender</th>
                        <th>Status</th>
                        <th>Action</th>
                    </tr>
                </thead>
                <tbody>
                    <?php
                    $i = 1;
                    $stat = array("Pending","Created","In-Progress","On-Hold","Over Due","Done");
                    $where = "";





                    if($_SESSION['login_type'] == 2){
                        $where = " where manager_id = '{$_SESSION['login_id']}' ";
                    }elseif($_SESSION['login_type'] == 3){
                        $where = " where concat('[',REPLACE(user_ids,',','],['),']') LIKE '%[{$_SESSION['login_id']}]%' ";
                    }
                    $qry = $conn->query("SELECT * FROM project_list $where order by date_created desc");
                        while($row= $qry->fetch_assoc()):
                        $trans = get_html_translation_table(HTML_ENTITIES,ENT_QUOTES);
                        unset($trans["\""], $trans["<"], $trans[">"], $trans["<h2"]);
                        $desc = strtr(html_entity_decode($row['description']),$trans);
                        $desc=str_replace(array("<li>","</li>"), array("",", "), $desc);

                        $tprog = $conn->query("SELECT * FROM task_list where project_id = {$row['id']}")->num_rows;
                        $cprog = $conn->query("SELECT * FROM task_list where project_id = {$row['id']} and status = 3")->num_rows;
                        $prog = $tprog > 0 ? ($cprog/$tprog) * 100 : 0;
                        $prog = $prog > 0 ?  number_format($prog,2) : $prog;
                        $prod = $conn->query("SELECT * FROM user_productivity where project_id = {$row['id']}")->num_rows;
                        if($row['status'] == 0 && strtotime(date('Y-m-d')) >= strtotime($row['start_date'])):
                        if($prod  > 0  || $cprog > 0)
                          $row['status'] = 2;
                        else
                          $row['status'] = 1;
                        elseif($row['status'] == 0 && strtotime(date('Y-m-d')) > strtotime($row['end_date'])):
                        $row['status'] = 4;
                        endif;
                    ?>

                    <tr>
                        <th class="text-center"><?php echo $i++ ?></th>
                        <td>
                            <p><b><?php echo ucwords($row['wr']) ?> - <span class="badge badge-primary"><?php echo ucwords($row['workstype']) ?></span></b> - <b><?php echo ucwords($row['name']) ?></b> - <?php echo ucwords($row['location']) ?></p>

                            <p class="truncate"><?php echo strip_tags(html_entity_decode($desc)) ?></p>
                        </td>
                        <td><b><?php echo date("M d, Y",strtotime($row['start_date'])) ?></b></td>
                        <td><b><?php echo date("M d, Y",strtotime($row['end_date'])) ?></b></td>
                        <td class="text-left">
                            <?php
                              if($stat[$row['status']] =='Pending'){
                                echo "<span class='badge badge-secondary'>{$stat[$row['status']]}</span>";
                              }elseif($stat[$row['status']] =='Created'){
                                echo "<span class='badge badge-primary'>{$stat[$row['status']]}</span>";
                              }elseif($stat[$row['status']] =='In-Progress'){
                                echo "<span class='badge badge-info'>{$stat[$row['status']]}</span>";
                              }elseif($stat[$row['status']] =='On-Hold'){
                                echo "<span class='badge badge-warning'>{$stat[$row['status']]}</span>";
                              }elseif($stat[$row['status']] =='Over Due'){
                                echo "<span class='badge badge-danger'>{$stat[$row['status']]}</span>";
                              }elseif($stat[$row['status']] =='Done'){
                                echo "<span class='badge badge-success'>{$stat[$row['status']]}</span>";
                              }
                            ?>
                        </td>
                        <td class="text-center">
                            <button type="button" class="btn btn-default btn-sm btn-flat border-info wave-effect text-info dropdown-toggle" data-toggle="dropdown" aria-expanded="true">
                              Action
                            </button>
                            <div class="dropdown-menu" style="">
                              <a class="dropdown-item view_project" href="./index.php?page=view_project&id=<?php echo $row['id'] ?>" data-id="<?php echo $row['id'] ?>">View</a>
                              <div class="dropdown-divider"></div>
                              <?php if($_SESSION['login_type'] != 3): ?>
                              <a class="dropdown-item" href="./index.php?page=edit_project&id=<?php echo $row['id'] ?>">Edit</a>
                              <div class="dropdown-divider"></div>
                              <a class="dropdown-item delete_project" href="javascript:void(0)" data-id="<?php echo $row['id'] ?>">Delete</a>
                          <?php endif; ?>
                            </div>
                        </td>
                    </tr>   
                <?php endwhile; ?>
                </tbody>
            </table>
        </div>
    </div>
</div>

<style>
    table p{
        margin: unset !important;
    }
    table td{
        vertical-align: middle !important
    }
</style>
<script>

$(document).ready( function () {
  $.fn.dataTable.ext.search.push(
    function( settings, searchData, index, rowData, counter ) {
      var status = $('input:checkbox[name="filter2"]:checked').map(function() {
        return this.value;
      }).get();

      if (status.length === 0) {
        return true;
      }

      if (status.indexOf(searchData[4]) !== -1) {
        return true;
      }

      return false;
    }
  );


  var table = $('#list').DataTable();

 $('input:checkbox').on('change', function () {
    table.draw();
 });



    $('.delete_project').click(function(){
    _conf("Are you sure to delete this project?","delete_project",[$(this).attr('data-id')])
    })
    })
    function delete_project($id){
        start_load()
        $.ajax({
            url:'ajax.php?action=delete_project',
            method:'POST',
            data:{id:$id},
            success:function(resp){
                if(resp==1){
                    alert_toast("Data successfully deleted",'success')
                    setTimeout(function(){
                        location.reload()
                    },1500)

                }
            }
        })
    }


</script>

Answers

  • allanallan Posts: 62,990Questions: 1Answers: 10,367 Site admin

    Are you able to link to me the running code please, so I can see it and the data in action. It makes debugging so much easier.

    Also, what interface are you planning to use for the state filter? A dropdown or something else?

    Allan

Sign In or Register to comment.