vendredi 20 décembre 2019

Taking input in PHP from checkbox in loop

<?php

if(isset($_POST['submit'])){
    $field_Values_array = $_POST['field_name'];
    $pass_array = $_POST['class'];

    $sg = "";

    $len1 = count($field_Values_array);
    $class = implode(", ",$pass_array);

    $x=0;
    while($x<$len1){
        $sg = $sg."Book - ".$field_Values_array[$x]." Set - ".$class."<br>";
        $x++;
    }

    echo $sg;

    print '<pre>' ; print_r($field_Values_array); print '</pre>';
    print '<pre>' ; print_r($pass_array); print '</pre>';
}

?>


<!doctype html>
<html>
<head>
<meta charset="utf-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    var maxField = 10; //Input fields increment limitation
    var addButton = $('.add_button'); //Add button selector
    var wrapper = $('.field_wrapper'); //Input field wrapper
    var fieldHTML = '<div><input type="text" name="field_name[]" value=""/> <input type="checkbox" name="class[]" value="A" />A <input type="checkbox" name="class[]" value="B" />B <input type="checkbox" name="class[]" value="C" />C <input type="checkbox" name="class[]" value="1" />1 <input type="checkbox" name="class[]" value="2" />2 <input type="checkbox" name="class[]" value="3" />3 <input type="checkbox" name="class[]" value="4" />4 <input type="checkbox" name="class[]" value="5" />5 <input type="checkbox" name="class[]" value="6" />6 <input type="checkbox" name="class[]" value="7" />7 <input type="checkbox" name="class[]" value="8" />8 <a href="javascript:void(0);" class="remove_button"><img src="remove.png"/></a></div>'; //New input field html 
    var x = 1; //Initial field counter is 1

    //Once add button is clicked
    $(addButton).click(function(){
        //Check maximum number of input fields
        if(x < maxField){ 
            x++; //Increment field counter
            $(wrapper).append(fieldHTML); //Add field html
        }
    });

    //Once remove button is clicked
    $(wrapper).on('click', '.remove_button', function(e){
        e.preventDefault();
        $(this).parent('div').remove(); //Remove field html
        x--; //Decrement field counter
    });
});
</script>
</head>
<body>
<div class="container">
    <form action="index.php" method="post">
        <div class="field_wrapper">
            <div>
                <input type="text" readonly value="Book Name"/>
                <input type="text" readonly value="Book Set"/>
            </div>
            <div>
                <input type="text" name="field_name[]" value=""/>
                <input type="checkbox" name="class[]" value="A" />A
                <input type="checkbox" name="class[]" value="B" />B
                <input type="checkbox" name="class[]" value="C" />C
                <input type="checkbox" name="class[]" value="1" />1
                <input type="checkbox" name="class[]" value="2" />2
                <input type="checkbox" name="class[]" value="3" />3
                <input type="checkbox" name="class[]" value="4" />4
                <input type="checkbox" name="class[]" value="5" />5
                <input type="checkbox" name="class[]" value="6" />6
                <input type="checkbox" name="class[]" value="7" />7
                <input type="checkbox" name="class[]" value="8" />8
                <a href="javascript:void(0);" class="add_button" title="Add field"><img src="add.png"/></a>
            </div>
        </div><br><input type="submit" name="submit" value="Submit">
    </form>
</div>
</body>
</html>

enter image description here

I want my code to work as if in the first input field I write english and select A, B, C and then press plus sign and add another pair of same fields then I write Hindi and choose 1 to 8 and press submit. The output should be like Book - English and Set - A,B,C Book - Hindi and Set - 1,2,3,4,5,6,7,8

but I am not able to get this result.




Aucun commentaire:

Enregistrer un commentaire