CODEWITHSUNDEEP
phpjavascriptjqueryformshide
arboles
arboles

Reputation: 1331

hiding a div after submitting a form using jquery?

I am using a onclick function on my form submit button to hide a div. but it is not hiding. what is the best way to do this? I want to hide a div on my page, after submitting a form. 

<form action="" method="POST">
<input type="submit" onclick="hide_group_posts();">
</form>

<div id='div_i_want_to_hide'>
<?php include $_SERVER['DOCUMENT_ROOT']."page.php";?>
</div>

<script>
function hide_group_posts(){
$('#div_i_want_to_hide').hide();
}
</script>

Upvotes: 0

Views: 8355

Answers (1)

gdoron
gdoron

Reputation: 150253

$('form').submit(function(){
    $('#div_i_want_to_hide').hide();  
});

If it didn't help you, one of the following must be true:

  • You didn't reference the jQuery library.
  • You didn't wrap the code with the DOM ready event.
  • You got typos.
  • The submit function worked, and you got new page, because you didn't prevent the default.

Prevent it like this:

$('form').submit(function(e){
    $('#div_i_want_to_hide').hide();  
    e.preventDefault();
    // Or with: return false;        
});

Upvotes: 9

Related Questions