How To Build An SQL Query From HTML Checkboxes?

I need to create a query builder for SQL, where you can choose query constraints via HTML checkboxes. Each checkbox has a name,used for a column name (e.g ActorName), and a value f

Solution 1:

You can use "serialize" for get and send data with Ajax

First, add a form balsise in your HTML code

Example :

<form>
    <div id="checkboxes">
        <label>
            <input type="checkbox" value="Tom Hanks" name="actorName[]">Tom Hanks</label>
        <label>
            <input type="checkbox" value="Tim Allen" name="actorName[]">Tim Allen</label>
        <label>
            <input type="checkbox" value="Don Rickles" name="actorName[]">Don Rickles</label>
        <label>
            <input type="checkbox" value="Jim Varney" name="actorName[]">Jim Varney</label>
        <label>
            <input type="checkbox" value="Wallace Shawn" name="actorName[]">Wallace Shawn</label>
        <label>
            <input type="checkbox" value="Fantasy" name="genreName[]">Fantasy</label>
        <label>
            <input type="checkbox" value="Comedy" name="genreName[]">Comedy</label>
        <label>
            <input type="checkbox" value="Children" name="genreName[]">Children</label>
        <label>
            <input type="checkbox" value="Animation" name="genreName[]">Animation</label>
        <label>
            <input type="checkbox" value="Adventure" name="genreName[]">Adventure</label>
        <label>
            <input type="checkbox" value="USA" name="countryName">USA</label>
    </div>
</form>

Your javascript :

jQuery(document).ready(function($){
    $(':checkbox').change(function() {
        sendData();
    });
})

function sendData () {
    var $form = $('form');
        $.ajax({
            url : 'ajax.php',
            data: $form.serialize(),
            async : false,
            success : function(response){
                console.log(response);
            }
        });
}

Your ajax.php

<?php
var_dump($_REQUEST);

Show :

array(2) {
  ["actorName"]=>
  array(3) {
    [0]=>
    string(9) "Tim Allen"
    [1]=>
    string(10) "Jim Varney"
    [2]=>
    string(13) "Wallace Shawn"
  }
  ["genreName"]=>
  array(1) {
    [0]=>
    string(9) "Animation"
  }
}

Each time you click on checkbox, you send data for ajax.php. So, you can make the query server side

Edit : Sorry I've forgot : You can rename your checkbox name for send a array

<label>
    <input type="checkbox" value="Tom Hanks" name="actorName[]">Tom Hanks</label>
<label>
    <input type="checkbox" value="Tim Allen" name="actorName[]">Tim Allen</label>
<label>