to pass a (dynamic) list of checkbox values using Ajax in php

Question

here is my code:

<input type="text" name="text" id="text">
<input type="button" name="but" id="but" value="click" onClick="click1()">
<div id="show_result"></div>
<?php
    echo "<br><input type='checkbox' name='type' id='all' class='type' value='all' onChange='check_change()'> All<br>";
    $gp=0;
    while($gp<5)// this 5 is for example 
    //it will vary in my original code based on DB values,
    //also $gp is not a number its actually a variable in my code.
    {
        echo "<input type='checkbox' name='type' id=".$gp." class='type' value=".$gp." onChange='check_change()'>  ".$gp."<br>";
        $gp++;
    }
?>
<script src="jquery-1.8.3.min.js"></script>
<script type="text/javascript">
function check_change()
{
    var a=[];
    if(document.getElementsByClassName('type')[0].checked)
    {
        $(".type").attr("checked", true);
        a[0]=document.getElementsByClassName('type')[0].value;
    }
    else
    {
        var x = document.getElementsByClassName('type');
        var i,j=0;
        for (i = 0; i < x.length; i++) {
            if(document.getElementsByClassName('type')[i].checked)
            {
                a[j]=document.getElementsByClassName('type')[i].value;
                j++;
            }
        }
    }
    display(document.getElementById('text').value,document.getElementsByClassName('type').value);
}
$(function()
{
    $(".type").attr("checked", true);
});
function click1()
{
    display(document.getElementById('text').value,document.getElementsByClassName('type').value);
}
function display(c,d) {
    $.post("s.php?c="+c+"&d="+d,{data : "some data"}, function(response){
        $("#show_result").html(response);
    });
}
</script>

i am having a textbox and a button and a dynamic list of checkboxes. I need to pass the value of the textbox and all the checked checkboxes using ajax call on two events one is button click and other is onChange of checkbox values and print those values inside a div.

s.php is the file i called using Ajax

S.php:

<?php
$c=$_GET['c'];
$d=[];
$d=$_GET['d'];
echo $d;
echo $c;
?>

Is it possible to pass these checked checkbox values using array? if so how to do it? or give me any other suggestion.

EDIT:

$(function()
    {
        $(".type").attr("checked", true);
    });
    var checkedArray = array();
function check_change()
    { 
$('.type:checked').each(function() {
    checkedArray.push($(this).attr("id"));
    display(document.getElementById('text').value);
});
    }
    function click1()
    {
        display(document.getElementById('text').value);
    }
    function display(c) {
        $.post("s.php?c="+c+"&d="+checkedArray,{data : "some data"}, function(response){
   $("#show_result").html(response);
   });

    }

Answer 1

<script src='http://code.jquery.com/jquery-2.1.3.min.js'></script>

    <input type='text' id='txt'>
    <input type='button' id='btn1' value='click'>
    <?php
        echo "<br><input type='checkbox' name='type' id='all' class='type' value='all' onChange='$(this).check_change()'> All<br>";
        $gp=0;
        while($gp<5) 
        {
            echo "<input type='checkbox' name='type' id=".$gp." class='type' value=".$gp." onChange='$(this).check_change()'>  ".$gp."<br>";
            $gp++;
        }
    ?>

    <script>
    $(document).ready(function(){

        $.fn.check_change = function(){
            $("#btn1").trigger("click");
        }

        $("#all").click(function(){
            if($(this).prop('checked')) {
                $('.type').each(function() {
                        $(this).attr("checked","checked");
                    });
            }
            else {
                $('.type').each(function() {
                    $(this).prop("checked",false);
                });
            }
             $("#btn1").trigger("click");
        });

        $("#btn1").click(function(){
            txt = $("#txt").val();
            chechedArray = Array();
            $('.type:checked').each(function() {
            chechedArray.push($(this).attr("id"));
            });
            $.post('s.php',{txt:txt,check:chechedArray},function(data,status){
                alert('Response from server\n' + data );
            });
        });
    });
    </script>

s.php

<?php 
    if(isset($_POST['txt']))
    echo $_POST['txt'];
    if(isset($_POST['check']))
    print_r($_POST['check']);
?>