Изменить активное на неактивное с помощью кнопок реального времени

Question

Я использую DataTables с ajax, используя PHP CodeIgniter Framework. У меня проблема с переключением активных кнопок на неактивные кнопки, и наоборот.

То, что я хочу, это:

Когда я нажимаю кнопку «Активно», она должна измениться на «Неактивно» в реальном времени без обновления страницы.

Контроллер:

function activateStatus() {
    $id = $this->uri->segment(3);
    $data = array(
        'status' => 1
    );
    $this->equip_model->updateAccount('equip', $data, array('id' =>$id));             
}

function deactivateStatus() {
    $id = $this->uri->segment(3);
    $data = array(
        'status' => 0
    );
    $this->equip_model->updateAccount('equip', $data, array('id' =>$id));             
}

Вид:

<table class="table table table-hover table-bordered" id="equipmain">
    <thead>
        <tr>
          <th>ID</th>
          <th>Status</th>
        </tr>
    </thead>
    <tbody>
    <?php 
       foreach ($equip as $row){
    ?>
        <tr>
          <td style="display: none;"><?= $row->id ?></td>
          <td align="center">
               <?php 
               $status = $row->status;
               if($status  == "1") { ?>                                    
                        <button id="<?php echo $row->id ?>" class="btn btn-xs green-jungle statusupdate1">&#10003</button>
               <?php } else  { ?>                                    
                        <button id="<?php echo $row->id ?>" class="btn btn-xs red-flamingo statusupdate0" >&#10005</button>
               <?php } ?>           
          </td>
       </tr>
    </tbody>
</table>

AJAX:

var oTable =  $('#equipmain').DataTable( {
            "searching": false,        
            "processing":true,
            "columnWidth": 20,                 
            "serverSide": true,
            "autoWidth": true,

        }); 

$(document).on('click', '.statusupdate0', function() {
            var id = $(this).attr("id");

            $.ajax({
                url: "<?= base_url() ?>Admin/activateStatus/" + id,
                success: function (data) {
                    oTable.ajax.reload();
                }
            });

        });

        $(document).on('click', '.statusupdate1', function() {
            var id = $(this).attr("id");

            $.ajax({
                url: "<?= base_url() ?>Admin/deactivateStatus/" + id,
                success: function (data) {                     
                    oTable.ajax.reload();
                }
            });

        });

Я не знаю, где ошибка, почему кнопки не работают.

Answer 1

Возможно, вы пропустили точку с запятой (;) после вашего base_url() звонка. В разделе AJAX для обеих кнопок попробуйте изменить <?= base_url() ?> на <?= base_url(); ?> и посмотреть, решит ли это проблему.