title: Select multiple checkboxes and update the database using submit button
body: <p>I have just finished small project on multiple checkboxes using ajax. But now i want to use submit button for filter option. So now after multiple checkboxes are selected and after sumbit button are clicked then only it should change in the phone database. Any help ? Thanks. 
  Here is my code: 
  Index.php</p>
  
  <pre><code>&lt;script&gt;
  
  
   function makeTable(data){
      var tbl_body = "";
      $.each(data, function() {
        var tbl_row = "",
            currRecord = this;
  
        $.each(this, function(k , v) {
          if(k==='model'){
            v = "&lt;a href='content.php?id=" + currRecord['id'] +"'&gt;" + v + "&lt;/a&gt;";
          } else if (k==='price'){
            v = "&lt;span class='price'&gt;" + v + "&lt;/span&gt;";
          }
          tbl_row += "&lt;td&gt;"+v+"&lt;/td&gt;";
        })
        tbl_body += "&lt;tr&gt;"+tbl_row+"&lt;/tr&gt;";
      })
  
      return tbl_body;
    }
  
    function getPhoneFilterOptions(){
      var opts = [];
      $checkboxes.each(function(){
        if(this.checked){
          opts.push(this.id);
        }
      });
  
      return opts;
    }
  
  
    function updatePhones(opts){
      if(!opts || !opts.length){
        opts = allBrands;
      }
  
      $.ajax({
        type: "POST",
        url: "submit.php",
        dataType : 'json',
        cache: false,
        data: {filterOpts: opts},
        success: function(records){
          $('#phones tbody').html(makeTable(records));
          updatePrices();
        }
      });
    }
  
    function subsidyIsValid(){
      var amount1 = $("#amount1").val(),
          amount2 = $("#amount2").val(),
          regex = /^\d+$/,
          inputValid = false;
  
      if(regex.test(amount1) &amp;&amp; regex.test(amount2)){
        var newTotal = Number(amount1) + Number(amount2)
        $("#total").text(newTotal);
        inputValid = true;
      }
  
      return inputValid
    }
  
    function updatePrices(){
      var subsidyTotal = Number($("#total").text());
  
      $(".price").each(function(){
        var origVal = Number($(this).text())
        $(this).text(origVal - subsidyTotal)
      })
    }
  
   $("#submitFilter").on("click", function(){
      var opts = getPhoneFilterOptions();
      updatePhones(opts);
          })
  
    $("#apply").on("click", function(){
      if(subsidyIsValid()){
        $(this).prop("disabled", true);
        $(this).next().prop("disabled", false);
        updatePrices();
      } else {
        alert("Subsidy invalid!")
      }
    });
  
    $("#remove").on("click", function(){
      $("#amount1").val("");
      $("#amount2").val("");
      $("#total").text("0");
      $(this).prop("disabled", true);
      $(this).prev().prop("disabled", false);
  
      $checkboxes.trigger("change");
    });
  
    var allBrands = [];
    $("input[type=checkbox]").each(function(){
      allBrands.push($(this)[0].id)
    })
  
    updatePhones();
    updatePrices();
  &lt;/script&gt; 
  </code></pre>
  
  <p>Submit.php</p>
  
  <pre><code>&lt;?php 
  require 'Database.php';
  #### TEMP SET NAMES FÜR UTF8 ###################################################
  include 'Json.php';
    $opts = $_POST['filterOpts'];
    $tmp = array();
    foreach ($opts as $opt) {
          $tmp[] = '"'.$opt.'"';
    }
           $query = 
        'SELECT mobile_phone.id, name, model, price FROM mobile_phone INNER JOIN brand ON brand_id = brand.id WHERE name IN ('.implode(",", $tmp).')';
  
  
    $result = mysql_query($query);
    $data   = array();
    while ($row = mysql_fetch_assoc($result)) {
    $data[] = $row;
    }
  
  echo json_encode($data);
  ?&gt;
  </code></pre>