mercredi 3 juin 2015

checkbox in paginated datatable

I have a datatable and buttons for delete and update. And these button are disabled. I also have some checkbox in the first column of every row. Whenever I click the checkbox, the edit and delete button will be enabled. It is working on the first page of my datatable but when I click a row from other pages of the datatable, it doesn't enabling the buttons. What is the problem with it? I have this code:

HTML Table:

<table class="table table-bordered table-hover table-striped" id="account_data" width="100%" style="margin-top: 0px">  <thead class="header">

      <tr  class="well"><th colspan="3" style="text-align:center">LIST OF USERS</th></tr>
      <tr class="well"> 
        <th style="width: 5px"><input type="checkbox" class="check"/></th>
        <th style="font-size: 14px;padding-left: 20px;"> ID#</th>
        <th style="font-size: 14px;padding-left: 20px;"> Name</th> 

      </tr>
    </thead>

    <tbody>
      <?php if($users != NULL){?>
        <?php foreach($users as $row){ ?>

            <tr> 
                <td align="center"><input type="checkbox" class="accounts" name="accounts[]" value="<?php echo $row->user_id;?>"/></td>
            <td style="font-size: 15px;padding-left: 20px;"><?php echo $row->user_id;?></td>
              <td style="font-size: 15px;padding-left: 20px;"><?php echo $row->user_name;?></td>

          </tr>
        <?php }?>
      <?php }?>
    </tbody>
  </table>

JQUERY:

<script>
$(document).ready(function(){
    var count=0;
    var chkId=new Array();
    var checkedValue ='';
    $('.check').click(function() {
        $(" .check").each(function () {
            if($(this).is(":checked"))
            {
                $(" .accounts").prop('checked',true);
                // $('#edit_acc').prop('disabled',false);
                 var n = $( " .accounts:checked" ).length;

                if(n==1){
                    $('#edit_acc').prop('disabled',false);
                }
                if(n>1){
                    $('#edit_acc').prop('disabled',true);
                }
                $('#delete_acc').prop('disabled',false);
                return
            }
            $(" .accounts").prop('checked',false);
            $('#edit_acc').prop('disabled',true);
            $('#delete_acc').prop('disabled',true);
        });

    });
});
</script>




Aucun commentaire:

Enregistrer un commentaire