Adding new Option() to a select box doesn't work

Discussion in 'Javascript' started by Rob, Sep 14, 2006.

  1. Rob

    Rob Guest

    Hi,
    Is there anything wrong with this code or does new Option just not work
    very well.
    I have a select box on my form:
    <select name="FirstLine" size="5" style="width:122px;">
    </select>

    and I have a form element:
    <form METHOD="post" ACTION="Scale_New.asp" id="Scale_New"
    name="Scale_New">

    I'm trying to do something a little more complex but for the sake of
    just getting this to work..I've simplified it and this doesn't work
    either.

    I have a button that calls a javascript function that adds "options" to
    the select box.
    <button name="FirstLine" onclick="Add1();">Add First Line</button>

    and here's my javascript function:
    function Add1()
    {
    document.Scale_New.FirstLine.options[0] = new Option('new text', 'new
    value');

    }
    and I get an error "document.Scale_New.FirstLine.options is null or not
    an object"

    I've tried changing it to document.forms[0] and changing the options to
    options[1] or even options[document.Scale_New.FirstLine.options.length]
    and that doesn't work either.
    Does anyone see anything wrong here?
    I'm using IE 6.

    Thanks
    Rob



    *** Sent via Developersdex http://www.developersdex.com ***
     
    Rob, Sep 14, 2006
    #1
    1. Advertising

  2. Rob wrote:


    > <select name="FirstLine" size="5" style="width:122px;">
    > </select>



    > <button name="FirstLine" onclick="Add1();">Add First Line</button>


    If you need a name for that button then choose one different from the
    name for the select. And adding type="button" is a good idea e.g.
    <button name="buttonName" type="button" onclick="Add1();">

    That should fix it, as least judging from the details you have provided.
    If not post a URL.


    --

    Martin Honnen
    http://JavaScript.FAQTs.com/
     
    Martin Honnen, Sep 14, 2006
    #2
    1. Advertising

  3. Rob

    Ray Guest

    Rob wrote:
    > Does anyone see anything wrong here?
    > I'm using IE 6.
    >
    > Thanks
    > Rob
    >


    I tried your code unmodified, seems to run fine:

    <html>
    <head>
    </head>
    <script>
    function Add1()
    {
    document.Scale_New.FirstLine.options[0] = new Option('new text', 'new
    value');

    }

    </script>
    <body>
    <button name="FirstLine" onclick="Add1();">Add First Line</button>
    <form METHOD="post" ACTION="Scale_New.asp" id="Scale_New"
    name="Scale_New">
    <select name="FirstLine" size="5" style="width:122px;">
    </select>

    </form>
    </body>

    </html>
     
    Ray, Sep 14, 2006
    #3
  4. Rob

    Tim Slattery Guest

    Rob <> wrote:

    >Hi,
    >Is there anything wrong with this code or does new Option just not work
    >very well.
    >I have a select box on my form:
    ><select name="FirstLine" size="5" style="width:122px;">
    ></select>


    ><form METHOD="post" ACTION="Scale_New.asp" id="Scale_New"
    >name="Scale_New">


    >
    >I have a button that calls a javascript function that adds "options" to
    >the select box.
    ><button name="FirstLine" onclick="Add1();">Add First Line</button>
    >
    >and here's my javascript function:
    >function Add1()
    >{
    > document.Scale_New.FirstLine.options[0] = new Option('new text', 'new
    >value');
    >
    >}
    >and I get an error "document.Scale_New.FirstLine.options is null or not
    >an object"


    Your "button" and your "select" have the same "name" attribute:
    "FirstLine". I'd guess that although you're trying to access the
    select, you're getting the button instead. And the button, clearly,
    doesn't have an "options" property.

    So give them different names, or give the select group an "id"
    attribute, then access it using "document.getElementById()".

    --
    Tim Slattery
     
    Tim Slattery, Sep 14, 2006
    #4
  5. Rob

    Rob Guest

    Rob, Sep 14, 2006
    #5
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. palmiere
    Replies:
    1
    Views:
    413
    Erwin Moller
    Feb 9, 2004
  2. Replies:
    7
    Views:
    261
  3. shankwheat

    Adding Option to Select box

    shankwheat, Apr 27, 2007, in forum: Javascript
    Replies:
    1
    Views:
    85
  4. javelin
    Replies:
    1
    Views:
    106
  5. rvelosoo
    Replies:
    1
    Views:
    339
    Bart Van der Donck
    Aug 13, 2008
Loading...

Share This Page