how to checkbox value stored array when click checkbox using ajax

Question

HTML

<input type="checkbox" name=options[cid]" value='1'     
onChange="chkdeptCount(this.value)" class="test">    
<input type="checkbox" name=options[cid]" value='2'     
onChange="chkdeptCount(this.value)" class="test">

jquery:

function chkdeptCount(val){    
$.ajax({ url: '../ajax/AjaxCall.php',
    data: {Action:'IMPLODEARRAY',arrVal: val},
    type: 'post',
    success: function(output) {
   alert(output);
    $('.result').html(output);
    }
    });

}

PHP:

if($_POST['Action']=='IMPLODEARRAY'){       
    $arr_val[] = $_POST['arrVal'];      
    print_r($arr_val);
}

When I run this code does not return array value. It returns a single value WHY?

What have you already tried to achieve the expected result? And why did'nt it work? — Koen Hollander, Oct 07 '16 at 06:13
`name=options[cid]"` missing quote, both checkbox having onchange event, and u are using `this` for getting current value — devpro, Oct 07 '16 at 06:15
@shubhamkhatri You should not be altering the base example. As noted `name="options[cid]"` was not the in the OP. It was `name=options[cid]"` That may be the problem with the code. You should not edit the actual script, just the formatting. — Rasclatt, Oct 07 '16 at 06:19

score 0 · Answer 1 · edited May 23 '17 at 11:48

Note that, you are missing the quote here name=options[cid]".

And you are using onChange="chkdeptCount(this.value)" event with current value this, this will only return one value at once.

This is very basic Example:

HTML:

<form method="post" id="formID" action="">
<input type="hidden" name="Action" value="IMPLODEARRAY">
<input type="checkbox" name="options[cid]" value='1' class="test">
<input type="checkbox" name="options[cid]" value='2' class="test">
<input type="submit" name="submit" value="Submit" id="SubmitButton">
</form>

AJAX:

<script type="text/javascript">
$(document).ready(function(){
  $("#SubmitButton").click(function(){ // when submit button press
    var data = $("#formID").serialize(); // get all form input in serialize()
    $.ajax({
        url: YourURL, // add your url here
        type: "POST", // your method
        data: data, // your form data
        dataType: "json",  // you can use json/html type
        success: function(response) {
          console.log(response); // your response
        },
        beforeSend: function()
        {
            // if you want to display any loading message
        }
    });  // JQUERY Native Ajax End
    return false;
  });
});
</script>

PHP:

<?php
if(count($_POST) > 0){ // if you have some value in AJAX request
  if($_POST['Action'] == 'IMPLODEARRAY'){ // your condition
    print_r($_POST['options']); // get all checkbox value.
  }
}
?>

Few more example will help you to understand, you can you use: Submitting HTML form using Jquery AJAX | jQuery AJAX submit form

how to checkbox value stored array when click checkbox using ajax

1 Answers1