SitePoint Sponsor

User Tag List

Results 1 to 9 of 9
  1. #1
    SitePoint Enthusiast
    Join Date
    Oct 1999
    Posts
    33
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hello everyone,

    Could someone help me with this please?

    Is there a way to use the JavaScript onChange event handler to submit a form when an option is selected from a drop down list?

    ie.

    <Form Name="try" action="/cgi-bin/script.pl">
    <input type="hidden" name="hiddenopt" value="secret">
    <select name="list" onChange="this.form.submit">
    <option value="1">First option</option>
    <option value="2">Second option</option>
    <option value="3">Third option</option>
    </select></form>

    The onChange="this.form.submit" reflects what I would like to happen when an user makes a selection.

    Any ideas would be greatly appreciated, thanks in advance for your cooperation.

    Be Well

  2. #2
    SitePoint Author Kevin Yank's Avatar
    Join Date
    Apr 2000
    Location
    Melbourne, Australia
    Posts
    2,571
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    onChange="document.forms['try'].submit();"

    ------------------
    -Kevin Yank.
    http://www.SitePoint.com/
    Helping Small Business Grow Online!

  3. #3
    SitePoint Zealot
    Join Date
    May 2000
    Location
    Eugene, OR
    Posts
    178
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    In the head of your document you could put:

    <SCRIPT LANGUAGE="Javascript">

    <!--

    function navigate() {
    var menuIndex = document.formMenu.selectMenu.selectedIndex;
    location = document.formMenu.selectMenu.options[menuIndex].value;
    }
    //-->
    </script>


    and then in the form you could put:

    <form name="formMenu">

    <select name="selectMenu" onChange="navigate()">
    <option selected>Select Topic</option>
    <option value="page1.htm">Page 1</option>
    <option value="page2.htm">page 2</option>
    <option value="page3.htm">page 3 </option>

    </form>


    Unless I've made a typo, this will work. I use it on a site.

    Take Care,

    Adam

  4. #4
    SitePoint Enthusiast
    Join Date
    Oct 1999
    Posts
    33
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks for your help Kevin I appreciate it, but it doesn't work, IE says that the object does not accept this property or method.

    I also tried onChange="this.form.submit();" with the same results.

    Any suggestions would be very appreciated.

    Be Well

    [This message has been edited by LeoF (edited July 06, 2000).]

    [This message has been edited by LeoF (edited July 06, 2000).]

  5. #5
    SitePoint Enthusiast
    Join Date
    Oct 1999
    Posts
    33
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank you Adam, but that would be for viewing web pages, Iím trying to submit a form, your intention is very appreciated.

    Be Well


  6. #6
    SitePoint Author Kevin Yank's Avatar
    Join Date
    Apr 2000
    Location
    Melbourne, Australia
    Posts
    2,571
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    Leo,

    Can you provide the complete code you're trying that's giving you that error? The following works perfectly here:

    <BLOCKQUOTE><font size="1" face="Verdana, Arial">code/font><HR><pre>
    &lt;HTML&gt;
    &lt;HEAD&gt;
    &lt;TITLE&gt; Submit onChange &lt;/TITLE&gt;
    &lt;/HEAD&gt;
    &lt;BODY&gt;
    &lt;Form Name="try" action="/cgi-bin/script.pl"&gt;
    &lt;input type="hidden" name="hiddenopt" value="secret"&gt;
    &lt;select name="list" onChange="document.forms['try'].submit();"&gt;
    &lt;option value="1"&gt;First option&lt;/option&gt;
    &lt;option value="2"&gt;Second option&lt;/option&gt;
    &lt;option value="3"&gt;Third option&lt;/option&gt;
    &lt;/select&gt;&lt;/form&gt;
    &lt;/BODY&gt;
    &lt;/HTML&gt;
    [/code]

    ------------------
    -Kevin Yank.
    http://www.SitePoint.com/
    Helping Small Business Grow Online!

  7. #7
    SitePoint Enthusiast
    Join Date
    Oct 1999
    Posts
    33
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Oops, I'd forgotten to take out the submit button.

    Sorry about that Kevin, my apologies for wasting your time.

    Thanks a lot for your help, now it works fine, I appreciate it

    Be Well

  8. #8
    SitePoint Guru Vincent Puglia's Avatar
    Join Date
    Feb 2000
    Location
    where the World once stood
    Posts
    700
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi,

    I hate to show my ignorance or throw a wrench into things, but...

    How is anyone going to select option[0]?
    onChange fires with a change in the selected option. I guess what I'm asking is: Is your first option a 'dummy'? Because if it's not, no one will be able to select it.

    Vinny

    ------------------
    my site:GrassBlade: cut&paste javascript
    moderator at:The JavaScript Place Forums
    Javascript City

  9. #9
    SitePoint Enthusiast
    Join Date
    Oct 1999
    Posts
    33
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi Vincent,

    The example given is just generic code, the real implementation uses a dummy:

    &lt;OPTION VALUE="javascript:void(0)"&gt;Select Option&lt;/OPTION&gt;

    for the first option.

    Thanks for pointing this out as I'm sure it would help to clarify things for someone browsing the archives.

    Be Well


    [This message has been edited by LeoF (edited July 07, 2000).]


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •