CODEWITHSUNDEEP
jquery
Matthew J Coffman
Matthew J Coffman

Reputation: 322

JQuery to hide items in a ListBox

I have an .aspx page that contains a ListBox, ID="lstAvailRates". I'm trying to hide these by default using JQuery 

$(document).ready(function ()
{$('#lstAvailRates').hide();
});

This works, but the results are not desirable. I want to keep the ListBox and hide the items. The above hides the entire ListBox.

MC

Upvotes: 0

Views: 2149

Answers (4)

danblundell
danblundell

Reputation: 1483

$(document).ready(function () {
    $('#lstAvailRates').find('option').hide();
});

Finds the option element from a select and hides them. Just change the argument for 'find' to whichever elements within the #1stAvailRates element you want to hide.

Upvotes: 3

Simon Edström
Simon Edström

Reputation: 6619

I think this is what you want

$(document).ready(function (){
    $('#lstAvailRates li').hide();
});

The selector serach for a element with the tag li which belongs to a element with ID lstAvailRates

<ul id="lstAvailRates">
 <li>This will be hidded</li>
 <li>This will be hidded</li>
 <li>This will be hidded</li>
</ul>

Upvotes: 1

Shyju
Shyju

Reputation: 218772

Listbox will be rendered as an HTML select element in the browser.

This will hide all elements in the select except the first option. Assuming you have the "Select any is the first" option and you want to keep that.

$(function(){

    $("#lstAvailRates option").each(function(){        
       $(this).hide(); 
    });    

});​

working sample : http://jsfiddle.net/PBzuQ/7/

Upvotes: 0

Frank van Wijk
Frank van Wijk

Reputation: 3252

A list box is a select according to Wikipedia. So you have to do

$(document).ready(function () {
    $('#lstAvailRates').find('option').hide();
});

Upvotes: 0

Related Questions