Pass checkbox values with Jquery to PHP and display result in div

Posted by user1343955 on Stack Overflow See other posts from Stack Overflow or by user1343955
Published on 2012-07-04T21:12:03Z Indexed on 2012/07/04 21:15 UTC
Read the original article Hit count: 301

Filed under:
|
|

I want to filter realtime results with jQuery (just like on this site http://shop.www.hi.nl/hi/mcsmambo.p?M5NextUrl=RSRCH). So when someones checks a checkbox the results should update realtime (in a div). Now I'm a newbie with jQuery and I've tried lots of examples but I can't get it to work. Here's my code, could anyone tell what I'm doing wrong? Thank you very much!

HTML

<div id="c_b">
Kleur:<br />
<input type="checkbox" name="kleur[1]" value="Blauw"> Blauw <br />
<input type="checkbox" name="kleur[2]" value="Wit"> Wit <br />
<input type="checkbox" name="kleur[3]" value="Zwart"> Zwart <br />
<br />
Operating System:<br />
<input type="checkbox" name="os[1]" value="Android"> Android <br />
<input type="checkbox" name="os[2]" value="Apple iOS"> Apple iOS <br />
</div>

<div id="myResponse">Here should be the result</div>

jQuery

function updateTextArea() {         
     var allVals = [];
     $('#c_b :checked').each(function() {
       allVals.push($(this).val());
     });

     var dataString = $(allVals).serialize();

    $.ajax({
        type:'POST',
        url:'/wp-content/themes/u-design/filteropties.php',
        data: dataString,
        success: function(data){
            $('#myResponse').html(data);
        }
    });
  }

$(document).ready(function() {
   $('#c_b input').click(updateTextArea);
   updateTextArea();  
});

PHP

//Just to see if the var passing works
echo var_export($_POST);

© Stack Overflow or respective owner

Related posts about php

Related posts about jQuery