John Davidson

Message:

the code selecting only by single checkbox one by one, the result i am to looking for o get is when clicking or checkbox one geting result and when click second or third checkbox is submit all checkboxs once to the prosses page to get the result of all checkedboxs and refresh the display area

my jquery code :

$(".catcf").on('click', function() {



    if ($('input.catcf').is(':checked')) {        



    var catcf = Number($(this).val());

    

        $.ajax({

            url: 'processing.php',

            type: 'post',

            data: {catcf:catcf},

            beforeSend:function(){

                $(".block-courses").html("<div>Loading...</div>");

            },

            success: function(response){

                

                // Setting little delay while displaying new content

                setTimeout(function() {

                    // appending posts after last post with class="post"

                    $(".block-courses:last").after(response).show().fadeIn("slow");

                    $(".block-courses").html("");

            

                    

                }, 2000);





            }

        });

    





        }

                if ($('input.catcf').is(":not(:checked)")){

                    $( ".c"+Number($(this).val())).remove();

            }

            



           

    

    });

the selecting page

<input id="<?php echo $cat->category_id; ?>" type="checkbox" value="1" class="catcf" >

<input id="<?php echo $cat->category_id; ?>" type="checkbox" value="2" class="catcf" >

<input id="<?php echo $cat->category_id; ?>" type="checkbox" value="3" class="catcf" >

<input id="<?php echo $cat->category_id; ?>" type="checkbox" value="4" class="catcf" >

<div class="block-course">

//reault here

</dive

the processing.php page just to see the results

echo "<pre>";

print_r($_POST);

echo "</pre>";

---

My Answer:
document).ready(function(){
$('input[type="checkbox"]').change(function(){
var checkedValues = [];
$('input[type="checkbox"]:checked').each(function(){
checkedValues.push($(this).val());
});

$.ajax({
url: 'process.php',
type: 'POST',
data: {checkedValues: checkedValues},
success: function(response){
$('#displayArea').html(response);
}
});
});
});



In your PHP code (process.php), you can retrieve the checked values and process them accordingly:

php
if(isset($_POST['checkedValues'])){
$checkedValues = $_POST['checkedValues'];

// Process the checked values here

// Return the result
echo "Checked values: " . implode(', ', $checkedValues);
}
?>


This way, when you check multiple checkboxes and click on any of them, all the checked values will be sent to the process.php file and the result will be displayed in the display area.