CODEWITHSUNDEEP
jqueryhtmlajax
Simpleton
Simpleton

Reputation: 6415

How to hide an element on an AJAX call?

I've got a page that has a dropdown menu, and upon selection, creates a new element (a table) using an AJAX call. Firebug shows this on action:

GET http://www.site.com/page.php?q=category

The actual code for this is:

select name="category" id="category" onchange="load(this.value)

However, in addition to it creating a new table, I'd like it to destroy/ not display another table that's already on the page. The table has class="table2" id="PR". What additional code do I put into that select tag above? Thanks

Upvotes: 1

Views: 2012

Answers (3)

TimCodes.NET
TimCodes.NET

Reputation: 4699

Without jQuery try:

onchange="load(this.value); document.getElementById('table1').style.display='none';"

Upvotes: 0

Richard Dalton
Richard Dalton

Reputation: 35793

I would change it so you have this code instead:

$(function() {
    $('#category').change(function() {
         load($(this).val());
         $('#PR').hide(); // or .remove() if you want to completely remove it;
    });
});

You can then remove the onchange from the select tag as it is wired up via the jquery event.

Upvotes: 2

luben
luben

Reputation: 2712

Try with the following:

$('#PR').remove();

But maybe you'll need to make a function to call onchange:

function mychange(event)
{
  load( event.currentTarget.value );
  $('#PR').remove();
}

select name="category" id="category" onchange="mychange(event)"

Upvotes: 3

Related Questions