Search code examples
phpajaxcodeignitercodeigniter-4

Json Array length always 1 Ajax Codeigniter 4


So I want to send my data to be deleted from my checkbox to my controller through ajax from my js file. It get passed but the length is always 1 whenever I check with count() or array_length(), although the output is displaying more than 1 variables.

jsondata

it display only 1 array length when I displayed using dd dd

the tables :

<?= form_open('/delete', ['class' => 'deleteBatch']); ?>
                <div class="w-fit">
                    <div class="grid grid-cols-2 gap-x-1 m-3">
                        <button data-toggle="modal" data-target="#createModal" class="inline-flex items-center justify-center rounded-md border border-transparent bg-primary-600 px-3 py-1 text-base font-medium text-white hover:bg-primary-700">New</button>
                        <button @click="deleteCheck()" class="inline-flex items-center justify-center rounded-md border border-transparent bg-primary-600 px-3 py-1 text-base font-medium text-white hover:bg-primary-700">Delete</button>
                    </div>
                </div>
                <div class="mb-3">
                    <?php $msg = session()->getFlashdata('message') ?>
                    <?php if ($msg) { ?>
                        <?php
                        if (is_array($msg)) {
                        ?>
                            <div class="bg-red-200 w-auto bg-opacity-50 border border-red-400 text-red-700 px-3 py-2 rounded relative" role="alert">
                                <?php foreach (session()->getFlashdata('message') as $row) : ?>
                                    <p class="block sm:inline"><?= $row; ?></p>
                                    <br>
                                <?php endforeach; ?>
                            </div>
                        <?php
                        } else {
                        ?>
                            <div class="bg-green-200 w-auto bg-opacity-50 border border-green-400 text-green-700 px-3 py-2 rounded relative" role="alert">
                                <span class="block sm:inline"><?= $msg; ?></span>
                            </div>
                        <?php
                        } ?>
                    <?php
                    } ?>
                </div>
                <div id='table'>
                    <table id="example" class="table-auto border-2 border-gray-400 cell-border">
                        <thead class="bg-gray-400">
                            <tr class="text-black">
                                <th>
                                    <input id="selectAll" name="selectAll " type="checkbox">
                                </th>
                                <th>Action</th>
                                <th>Project Name</th>
                                <th>Client</th>
                                <th>Project Start</th>
                                <th>Project End</th>
                                <th>Status</th>
                            </tr>
                        </thead>
                        <tbody class="text-black">
                            <?php //dd($project);
                            ?>
                            <?php foreach ($project as $row) : ?>
                                <tr>
                                    <td><input class="selectId" name="selectId" value="<?= $row->project_id; ?>" type="checkbox"><?= $row->project_id; ?></td>
                                    <td><a href="/edit">edit</a></td>
                                    <td><span id="projectName" name="projectName"><?= $row->project_name; ?></span></td>
                                    <td><span id="clientName" name="clientName"><?= $row->client_name; ?></span></td>
                                    <td id="dateProjectStart"><span id="dateProjectStart" name="dateProjectStart">{{translateMonth(<?= strtotime($row->project_start); ?>)}}</span></td>
                                    <td id="dateProjectEnd"><span id="dateProjectEnd" name="dateProjectEnd">{{translateMonth(<?= strtotime($row->project_end); ?>)}}</span></td>
                                    <td><span id="projectStatus" name="projectName"><?= $row->project_status; ?></span></td>
                                </tr>
                            <?php endforeach; ?>
                        </tbody>
                    </table>
                    <p>{{message}}</p>
                </div>
                <?= form_close(); ?>

the js (im using vue.js) :

const crud = Vue.createApp({
    data(){
        return{
            'project_id' : "",

        }
    },
    methods:{
        create(e){
            // console.log('hello')
            document.getElementById("createForm").submit();
        },
        translateMonth(date){
            const date2 = new Date(date*1000)
            const month = ["Jan","Feb","Mar", "Apr","Mei", "Jun","Jul", "Agu","Sep","Oct","Nov","Dec"]
            const dateFinal = date2.getDate() + ' ' + month[date2.getMonth()] + ' ' + date2.getFullYear()
            return dateFinal
        },
        deleteCheck(e){
            $('.deleteBatch').submit(function(e){
                e.preventDefault();

                let dataCount = $('.selectId:checked');
                if(dataCount.length == 0){
                    Swal.fire({
                        icon: 'warning',
                        title: 'Warning',
                        text: 'Please select at least one project',
                        confirmButtonText: 'Ok',
                        confirmButtonColor: '#2563eb',
                    })
                }else{
                    Swal.fire({
                            title: 'Are you sure you want to delete this project?',
                            text: dataCount.length + ' project will be deleted',
                            reverseButtons: true,
                            showCancelButton: true,
                            denyButtonText: `No`,
                            denyButtonColor: '#64748B',
                            confirmButtonText: 'Yes',
                            confirmButtonColor: '#2563eb',
                          }).then((result) => {
                            /* Read more about isConfirmed, isDenied below */
                            if (result.isConfirmed) {
                                $.ajax({
                                    type: "post",
                                    url: '/delete',
                                    dataType: 'json',
                                    data: $(this).serialize(),
                                    success:function(response){
                                        if (response.status == 200){
                                            Swal.fire({
                                                icon: 'success',
                                                title: 'Project deleted successfully',
                                                confirmButtonText: 'Ok',
                                                confirmButtonColor: '#2563eb',
                                            })
                                            window.location.replace('/project')
                                        }
                                    }

                                })
                            } else if (result.isDenied) {
                              Swal.fire('Changes are not saved', '', 'info')
                            }
                          })
                }
                return false;
            })
            // 
            
        }

    }
})
crud.mount('#crud')

the controller :

public function delete()
    {
        $session = \Config\Services::session();
        $projectModel = new ProjectModel();
        $selectedId = $this->request->getVar('selectId');
        $data = [
            'selectId' => $selectedId
        ];
        $dataCount = count($data);
        dd($dataCount);
    }

I' already change the $this->request->getVar('selectId'); to a $this->request->getPost('selectId') still no luck, already tried the json_decode too but still same


Solution

  • controller.php:

    $data = [
        'selectId' => $selectedId // <-- You only add 1 element to the array here.
    ];
    $dataCount = count($data); // <-- $data contains only 1 element at this point.
    dd($dataCount);
    

    In this part you set $datato be an array with one element in it (selectId). You need to add more elements to the array for it to be longer. count()does output the right value in this case (1).