martin.mishat's avatar

How to keep the selected checkboxes checked while pagination?

Greetings, new to Laravel. Using 5.3 and loving it. Having a problem with my checkboxes while pagination. I want to keep the selected checkboxes checked while pagination. Is there any way using 'appends' or 'session' or something else. Codes until now is provided below.

Form with a chekcbox:

        @foreach($cforms as $candidates)                 

        <tr>  

        <td>

        <input type="checkbox" name="checkbox" value= "{{$candidates->s_id}}" >

        </td>

        <td>{{$candidates->s_id}}</td>

        <td><img src="/uploads/cimage/{{ $candidates->cimage}}" style="width:200px;                                                  height:200px;"></td>

        <td>{{$candidates->planguage}}</td> 

        <td>{{$candidates->cproject}}</td>

        <td>{{$candidates->event}}</td>

        <td>{{$candidates->docs}}</td>

        <td>{{$candidates->created_at}}</td>

        </tr>

        @endforeach

      </table></br>

{{$cforms->links()}}

     @endunless 

Controller:

class cviewcontroller extends Controller { // public function cpview(){

$candidates = DB::table('cforms')

         ->where('position', 'President')

                         ->paginate(5); 

return view('cform.cpview', ['cforms' => $candidates]);
}

} Let me know if I have to provide anything else. Any help would be greatly appreciated. Thank you.

0 likes
15 replies
jlrdw's avatar

If you are new to php and html, Jeffrey has a free intro course. But you have to "test" the value and check it in code, or leave blank, something like:

<tr>
      <td>Adopted:</td>
      <td>
       <input type="checkbox" name="adopted" id="adopted" value="1"<?php echo ($cat->adopted == 1 ? ' checked' : ''); ?>>
       </td>
</tr>

I used a ternary.

Snapey's avatar

You would not be able to do this with standard pagination since storing the checkboxes is a form thing and needs to be posted to be remembered.

Perhaps you could do an ajax call with each checkbox click and store (or clear) it in the user's session.

Suppose you have 30 items (e.g. with id's) across 3 pages. You could have 3x ajax request for items 3,4 and 7 (store these in session) then the user paginates to page 2, and clicks on the 5th row which is item 15. Now you have 3,4,7,and 15 in session. They then click on the next page and select item 22 (now 3,4,7 and 22 'checked' in session). Finally they press submit, and in your controller you grab all the IDs from session.

A refinement would be to pass the array from session back into the view each time so that you can check boxes for the user if say they go back to page 1 and expect to see 3,4 and 7 still selected.

Snapey's avatar
Snapey
Best Answer
Level 122

Something I did years ago for a task list..

jQuery is called when you click on an item with a .comp class

You might take ideas from this?

jQuery(".comp").click(function() {
        var $checkbox = jQuery(this);
        var checkboxData = $checkbox.data("task");
        $checkbox.html("<i class='fa fa-lg fa-spinner fa-spin' ></i>");

        jQuery.ajax({
            url: "http:/tasks/taskComplete",
            type: "POST",
            data: 'taskId=' + checkboxData,
            cache: false,
            dataType: "json",
            success: function(data) {
                console.log(data);
                if(data=='set') {
                    $checkbox.html("<i class='fa fa-lg fa-check-square-o' ></i>");
                    $checkbox.parent().addClass("done");
                }
                if(data=='unset') {
                    $checkbox.html("<i class='fa fa-lg fa-square-o' ></i>");
                    $checkbox.parent().removeClass("done");
                }

            },
            error: function(data){
                if (data.status == 401 ){
                    alert("Your session has expired. Please refresh the page and login before continuing");
                } else {
                    alert("An Error Occurred")
                }
            }
        });
    });
1 like
jlrdw's avatar

Your form is a good canadate for x-editable.

jlrdw's avatar

sourceCache of checklist? I don't know what that even is. I referred you to x-editable, you are the one who mentioned ajax.

Snapey's avatar

@jlrdw please don't take offence but I don't see how any of your answers relate to the question?

jlrdw's avatar

@Snapey are you kidding, x-editable is for in place editing and adding. So how do you come up with

but I don't see how any of your answers relate to the question?

martin.mishat's avatar

Trying to solve guys, but is there any possibilities through session??? Or Append ???

Snapey's avatar

Because he wants to mark items checked or unchecked and then move on to the next page with paginate. We don't know what he wants to do with those selections.

My mistake, x-editable is an ajax enabled version of 'editable regions' so I suppose it can be used for the same effect. My initial reading was just editable not x-editable.

Please or to participate in this conversation.