Wrox Programmer Forums

Need to download code?

View our list of code downloads.

Go Back   Wrox Programmer Forums > Web Programming > JavaScript > Javascript How-To
Password Reminder
Register
Register | FAQ | Members List | Calendar | Search | Today's Posts | Mark Forums Read
Javascript How-To Ask your "How do I do this with Javascript?" questions here.
Welcome to the p2p.wrox.com Forums.

You are currently viewing the Javascript How-To section of the Wrox Programmer to Programmer discussions. This is a community of tens of thousands of software programmers and website developers including Wrox book authors and readers. As a guest, you can read any forum posting. By joining today you can post your own programming questions, respond to other developersí questions, and eliminate the ads that are displayed to guests. Registration is fast, simple and absolutely free .
DRM-free e-books 300x50
Reply
 
Thread Tools Display Modes
  #1 (permalink)  
Old February 17th, 2006, 06:29 AM
Friend of Wrox
Points: 7,425, Level: 36
Points: 7,425, Level: 36 Points: 7,425, Level: 36 Points: 7,425, Level: 36
Activity: 0%
Activity: 0% Activity: 0% Activity: 0%
 
Join Date: Jan 2005
Location: Mauchline, East Ayrshire, Scotland
Posts: 1,524
Thanks: 0
Thanked 0 Times in 0 Posts
Send a message via ICQ to crmpicco Send a message via AIM to crmpicco Send a message via MSN to crmpicco Send a message via Yahoo to crmpicco
Default delete options from a drop down

How can I dynamically add/delete options from a select object using JavaScript?
I am building new options in via JS, but want to delete all these first....
Code:
<select name="stadium" id="stadium" class="selects">
            <option selected>All</option>
            <option>Ibrox</option>
            <option>Parkhead</option>
            <option>Tynecastle</option>
            <option>Somerset Park</option>
</select>
Thanks,

Picco:D

www.crmpicco.co.uk
__________________
_______________________
Ayrshire Minis - a Mini E-Community
http://www.ayrshireminis.com
http://www.crmpicco.co.uk
Reply With Quote
  #2 (permalink)  
Old February 17th, 2006, 06:50 AM
joefawcett's Avatar
Wrox Author
Points: 9,712, Level: 42
Points: 9,712, Level: 42 Points: 9,712, Level: 42 Points: 9,712, Level: 42
Activity: 0%
Activity: 0% Activity: 0% Activity: 0%
 
Join Date: Jun 2003
Location: Exeter, , United Kingdom.
Posts: 3,066
Thanks: 1
Thanked 36 Times in 35 Posts
Default

You can delete all options by setting
Code:
document.getElementById("stadium").options.length = 0;
To remove individual options you can use removeChild (in IE, not sure about others):
Code:
var oList = document.getElementById("stadium");
var oOption = oList.options[2]; //Parkhead
oList.removeChild(oOption);
--

Joe (Microsoft MVP - XML)
Reply With Quote
  #3 (permalink)  
Old February 17th, 2006, 06:51 AM
Friend of Wrox
Points: 7,425, Level: 36
Points: 7,425, Level: 36 Points: 7,425, Level: 36 Points: 7,425, Level: 36
Activity: 0%
Activity: 0% Activity: 0% Activity: 0%
 
Join Date: Jan 2005
Location: Mauchline, East Ayrshire, Scotland
Posts: 1,524
Thanks: 0
Thanked 0 Times in 0 Posts
Send a message via ICQ to crmpicco Send a message via AIM to crmpicco Send a message via MSN to crmpicco Send a message via Yahoo to crmpicco
Default

thanks Joe, worked great

www.crmpicco.co.uk
Reply With Quote
  #4 (permalink)  
Old February 17th, 2006, 08:15 AM
Friend of Wrox
 
Join Date: May 2004
Location: , , .
Posts: 212
Thanks: 0
Thanked 0 Times in 0 Posts
Default

Just for a bit of fun on a boring quiet work friday afternoon I worked out a really long line of code to do the three line option above. Only this time I'm passing in the selectedIndex, so you delete whatever is selected. Probably not useful whatsoever, but i love shrinking lines of code wherever I can. Good learning excersize too! Can anyone find a shorter way? Just for fun:

var remElem =document.forms['form1'].elements['stadium'].removeChild(document.forms['form1'].elements['stadium'].options[document.forms['form1'].elements['stadium'].selectedIndex])

Joe's way is probably way more easy to use, but its fun to play with things like this I find! Obviously you need a form called form1 and a select called stadium.

Cheers!
Joe

Reply With Quote
  #5 (permalink)  
Old February 17th, 2006, 08:36 AM
Friend of Wrox
Points: 7,425, Level: 36
Points: 7,425, Level: 36 Points: 7,425, Level: 36 Points: 7,425, Level: 36
Activity: 0%
Activity: 0% Activity: 0% Activity: 0%
 
Join Date: Jan 2005
Location: Mauchline, East Ayrshire, Scotland
Posts: 1,524
Thanks: 0
Thanked 0 Times in 0 Posts
Send a message via ICQ to crmpicco Send a message via AIM to crmpicco Send a message via MSN to crmpicco Send a message via Yahoo to crmpicco
Default

this also works:
Code:
/*
FUNCTION NAME: deleteOption
Delete all the current options from the required drop down menu
*/
function deleteOption(selectbox)
{
    while(document.forms["fexp"].elements[selectbox].childNodes.length>0) {document.forms["fexp"].elements[selectbox].removeChild(document.forms["fexp"].elements[selectbox].childNodes[0])}
}

www.crmpicco.co.uk
Reply With Quote
  #6 (permalink)  
Old July 21st, 2008, 05:37 AM
Registered User
 
Join Date: Apr 2008
Location: , , .
Posts: 2
Thanks: 0
Thanked 0 Times in 0 Posts
Default

Thanks Joefawcett - I was trying this from morning and finally your code worked.

Reply With Quote
Reply


Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is Off
HTML code is Off
Trackbacks are Off
Pingbacks are On
Refbacks are Off

Similar Threads
Thread Thread Starter Forum Replies Last Post
Unable to delete file System.IO.Delete error maricar C# 13 March 14th, 2014 06:50 AM
php/mysql delete button and delete query dungey PHP Databases 17 April 11th, 2009 12:24 PM
Drop Down options to select stream for Listener sam8599 Javascript 0 May 29th, 2006 12:18 PM
drop down list values based on another drop down noor ASP.NET 1.0 and 1.1 Basics 3 July 5th, 2005 09:57 AM
how to delete a row when click delete hyperlink naveenkumarg1 Pro JSP 1 August 16th, 2004 01:29 AM



All times are GMT -4. The time now is 07:13 AM.


Powered by vBulletin® Version 3.7.0
Copyright ©2000 - 2014, Jelsoft Enterprises Ltd.
© 2013 John Wiley & Sons, Inc.