Insert multiple checkbox values into the MySQL table in a single column using jQuery Ajax in your web application. Selected multiple checkboxes and submit values into database.
First create a form and add some check box, which you like, in this tutorial I create some checkbox for insert multiple programming language. Create a submit button give button id name. You need to careful, when your work with jQuery, you need to connect the jQuery JS file.
Start the script, when you click the submit button, all selected checkbox value store in a single variable. Now pass the variable value in a PHP page using POST method. The page location, where you write insert query.
In PHP page connect the database page and call the variable values and insert. If data insert successfully, return success or return error, if insert error.
In jQuery alert success message when submit data success and submit error then alert error message. I will provide source code, you can use the cods in your project or web browser. Follow the example:
Example & Source Code:
Form Page:
<html> <head> <title>Multiple Checkbox value insert using jQuery</title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> </head> <body> <!-- Form Start: --> <form> <p><label>Select Programming languages:</label><br/></p> HTML: <input type="checkbox" name="p_lan" id="p_lan" value="HTML"> CSS: <input type="checkbox" name="p_lan" id="p_lan" value="CSS"> JavaScript: <input type="checkbox" name="p_lan" id="p_lan" value="JavaScript"> jQuery: <input type="checkbox" name="p_lan" id="p_lan" value="jQuery"> PHP: <input type="checkbox" name="p_lan" id="p_lan" value="PHP"> <p><input type="button" name="submit" id="submit_data" value="Submit" /></p> </form> <!-- // Form End: --> </body> </html>
Script:
<!-- Script: --> <script type="text/javascript" language="javascript" > $(document).ready(function(){ $("#submit_data").on('click',function(){ var pro_lan= []; $.each($('input[name="p_lan"]:checked'),function(){ pro_lan.push($(this).val()); }); var all_pro_lan=pro_lan.join(", "); $.ajax({ type: 'post', url: 'insert.php', data:{p_language:all_pro_lan}, success:function(data){ if(data==1){ alert("Insert Success"); }else{ alert("Insert Error!!"); } } }); }); }); </script>
PHP:
<?php $con=mysqli_connect("localhost","root","","test1") or die("database not connect"); $sql=mysqli_query($con,"INSERT INTO checkbox(`checkbox_value`)VALUES('".$_POST["p_language"]."')"); if($sql){ echo "1"; }else{ echo "0"; }
Nice post. I was checking continuously this blog
and I am impressed! Extremely helpful info specifically the last
part 🙂 I care for such information much. I was looking
for this particular information for a very long time.
Thank you and good luck.