Question 69736 in Ajax Question posted in
You can find the official documentation here.

sending array via ajax to php – Jquery ajax

I want to send an array of ids for the checked checkboxes via ajax to PHP. I keep getting Undefined array key "progid". when I alert the progid in jQuery I got the correct ids. I know it is duplicated question but I really searched a lot and tried a lot of solutions nothing works.

html code:

 while($row3 = $result3->fetch_assoc()) {
     $courseName = $row3['courseName'];
     $coursePrice = $row3['coursePrice'];
     $courseId = $row3['id'];
     $programList .= ' <div class="form-check">
                    
     <input type="checkbox" name="course[]" class="form-check-input" id="'.$courseId.'" value="'.$coursePrice.'">
     <label class="form-check-label" for="'.$coursePrice.'">'.$courseName .' price is '.$coursePrice.'$</label>
     </div>';

 } 
 echo $programList;

jQuery code:

$('#submit').click(function() {
    var progid = [];
    $.each($("input[name='course[]']:checked"), function(){
        progid.push($(this).attr("id"));  
    });  
                   
    $.ajax({
        type: "POST",
        url: "test.php",
        data: progid,
        success: function(data){
            console.log('success: ' + progid);   
        }
    });  
});

php code:

<?php
  extract($_POST);
  print_r($_POST);
  echo ($_POST["progid"]);
?>

Edit:
when I send the data to the same page it does work and displays the array inside a span , but when I send it to another PHP file it doesn’t work it displays the error.

Tags:

3

Answers


  1. 0

    Because you didn’t post all the html, is it possible that your submit event is not disabled with event.preventDefault(); and the ajax is not executing?

    $('#submit').click(function(e) {
    e.preventDefault();
..

    https://api.jquery.com/event.preventdefault/

    $.ajax({
        type: "POST",
        url: "test.php",
        data: {"progid" : progid},
        success: function(data) {
            console.log('success: ' + progid);   
        }
    });
    Login or Signup to reply.
  2. 0

    You can use JSON.stringify() for the array:

    $(document).ready(function () {
    $('#submit').click(function(e) {
        e.preventDefault();
        var progid = [];
        $.each($("input[name='course[]']:checked"), function(){
            progid.push($(this).attr("id"));  
        });
      
        let stringifyProgid = JSON.stringify(progid);
                       
        $.ajax({
            type: "POST",
            url: "test.php",
            data: {progid: stringifyProgid},
            success: function(data){
                console.log('success');   
            }
        });  
    });
});

    And in PHP you can get the array:

    <?php
  $arrProgid = json_decode($_POST["progid"]);
  var_dump($arrProgid);
?>
    Login or Signup to reply.
  3. 0

    I often do this with Multi Select form fields.

        var progid = [];
    $.each($("input[name='course[]']:checked"), function(){
        progid.push($(this).attr("id"));  
    });
    $.ajax({
        type: "POST",
        url: "ajax_post.php",
        data: {
            'progid[]': progid
        },
        success: function(data) {

        }
    });

    Then on the PHP system the $_POST[‘progid’] will be an array. So all the JSON encoding and decoding others have posted is not needed.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search