PHP Jquery onchange event

Question

I have a selectbox with filter featured in a form, how could I use jquery to replace onchange event to avoid whole page refresh? I want certain div block will be able to reload the callback data when certain option is selected.

<form name="form_filter" action="<?php echo $_SERVER['PHP_SELF'].'?'.$_SERVER['QUERY_STRING'].'#network-programs' ?>" method="post" enctype="multipart/form-data">
Genre:
<select name="filterGenre" id="filterGenre" onchange="this.form.submit()"  >
<option value="all" selected="selected">All</option>
<?php
$query1 = "SELECT * FROM video WHERE vcat_id IN(SELECT category_id FROM categories WHERE video_id IN(SELECT vid FROM `video` WHERE vuser_id='8') AND main_cat=1)";
$result = mysql_query($query1);

while($row = mysql_fetch_assoc($result)) {
    $vcat_id = stripslashes($row['vcat_id']);
    $vcat_name = stripslashes($row['vcat_name']);

    echo "<option value='".$vcat_id."'"; 
    if($vcat_id == $_POST['filterGenre']){echo ' selected ';}
    echo ">".$vcat_name."</option>";
}
?>
</select>

</form>

Please advise, thanks.

ajax will do it for you

alwaysLearn
– alwaysLearn

2013-04-18 07:16:38 +00:00
Commented Apr 18, 2013 at 7:16 — alwaysLearn
– alwaysLearn, Commented Apr 18, 2013 at 7:16

alwaysLearn · Accepted Answer · 2013-04-18 07:19:33Z

1

$(document).ready(function(){

$('#filterGenre').change(function(){

$.ajax({
      url   : your form action,
      data  : $('#your form id').serialize(),
      type : 'POST',
      success : function(data){
                      $('#yourdiv').html(data);
                  }

  })

})

})

remove onchange from select

answered Apr 18, 2013 at 7:19

alwaysLearn

6,9507 gold badges45 silver badges69 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

alwaysLearn Over a year ago

its html() that performs this... it handles the inner content of the html element.. api.jquery.com/html

Mehul Kaklotar · Accepted Answer · 2013-04-18 07:16:39Z

0

You can use AJAX with jquery.

w3schools

answered Apr 18, 2013 at 7:16

Mehul Kaklotar

3751 silver badge19 bronze badges

Comments

viljun · Accepted Answer · 2013-04-18 07:26:00Z

0

you might write something like this:

<form id='form' ...
   <select name="filterGenre" id="filterGenre" onchange="send_it()" ...
   ...

<script>
   function send_it(){
                      $.ajax({
                         type: 'GET',
                         url: 'http://www.site.com/page.php',
                         data: $('#form').serialize(),
                         success: function(){
                            alert('done!');
                         }
                      });
   }
</script>

answered Apr 18, 2013 at 7:26

viljun

3703 silver badges12 bronze badges

Collectives™ on Stack Overflow

PHP Jquery onchange event

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related