CODEWITHSUNDEEP
javascriptphpjqueryhtml
Jain
Jain

Reputation: 33

pass checked checkboxes string to php page from javascript

A Product List is created using the PHP code each product having its own checkbox, I have used the Java Script code to get values of all the selected checkboxes now i need to call an other PHP page which will receive this string data and populate all the selected products list. Can you please tell me the way i can use to send data to another php page using javascript POST method.

Code used to create the product list and get value of selected checkboxes is as follows :

<?php
$cnt=0;
$rslt = mysqli_query($conn,"SELECT Icode,Name,Size,Style FROM productinfo");
if(!$rslt)
{
    die(mysqli_error($conn));
}
else
{
    echo " <table width='100%'>";
    while($row = mysqli_fetch_assoc($rslt))
    {
        if($cnt==0)
        {
            echo "<tr>";
        }
        echo "<td width='30%'>
              <div class='card'>
              <img src='upload/"."download.jpg"."' alt='Avatar' style='width:100px' >
              <div class='container'>
                <h4><b>".$row['Name']."&nbsp;&nbsp;<input type='checkbox' name='prodchklist' value=".$row['Icode']." '/> </b></h4> 
                <p>".$row['Size']."</p> 
                <p>".$row['Icode']."</p> 
              </div>
            ";
            ?>
            </div>
    <?php
    echo "</td>";
    if($cnt==2)
    {
        $cnt=0;
        echo "</tr>";
    }
    else
        $cnt = $cnt + 1;
    }
}
echo "</table>";
?>
</div>
<button id="SendInquiry" style="display: block;">Send Inquiry</button>
<script type='text/javascript'>
$(document).ready(function(){
    $('#SendInquiry').click(function(){
        var result = $('input[type="checkbox"]:checked');
        if (result.length > 0)
        {
            var resultstring = result.length +"checkboxes are checked";
            result.each(function(){
            resultstring+=$(this).val();
            }
        );
        $('#divrslt').html(resultstring);
    }
    else
    {
      $('#divrslt').html("nothing checked");
    }
});
});

</script>

Upvotes: 0

Views: 1781

Answers (1)

Muhammad Alvin
Muhammad Alvin

Reputation: 1210

I don't know your reason to use javascript for collecting checkbox values and post it to another PHP page. You can achive what you want without javascript:

Wrap you checkboxes inside a form, set its action to second page, and don't forget to set its method to POST, eg:

<form action="second.php" method="post">
</form>

Put [] at the end of checkbox name to make it array that can send multiple values with one name, eg:

<input type="checkbox" name="prodchklist[]" value="item1">
<input type="checkbox" name="prodchklist[]" value="item2">
<input type="checkbox" name="prodchklist[]" value="item3">

But, if you really want to use javascript to call the second page, for example by using ajax, do this:

Store the selected values in an array, instead of appending each values in one variable.

// add this, to store the data you want to post
var data = {
    prodchklist: []
};

var result = $('input[type="checkbox"]:checked');
if (result.length > 0)
{
    var resultstring = result.length + " checkboxes are checked";
    result.each(function(){
        resultstring += $(this).val();
    }

    // add this
    data.prodchklist.push($(this).val());
}

Then during ajax call:

$.post('second.php', data, function(response) {
    ....
});

In your second PHP file, just retrieve it as usual, eg:

$selectedProducts = $_POST['prodchklist'];

This works for both approach (without javascript and with ajax).

$selectedProducts will be an array instead of simple string value. Just iterate the array to use the values, eg:

foreach ($selectedProducts as $product) {
    echo $product;
}

Upvotes: 1

Related Questions