Focussing problem with dynamic select element

Discussion in 'Javascript' started by Jonathan Parkes, Feb 16, 2004.

  1. I am having a problem with a select element that is modified at run-time
    in JavaScript. An additional option is added if the user enters any text
    in an adjacent textbox. The option is removed if the textbox is cleared.
    I have this functionality working fine, but there is a side-effect. If
    the user enters some text in the textbox, then clicks the combo box, it
    drops down and is immediately the list is retracted again. It requires a
    further two clicks to get the list to drop down again.

    Here is the relevant snippet of code:

    <select id="cboReservationDate">
    <option value="0">Current</option>
    <option value="1">Monday</option>
    <option value="2">Tuesday</option>
    {etc. for other working days}
    </select>
    <input id="txtTicketNumber" onkeypress="txtTicketNumber_onkeypress();"
    onchange="txtTicketNumber_onchange();" value="">

    <script language="javascript" type="text/javascript">
    <!--
    //only allow characters 0-9
    function txtTicketNumber_onkeypress()
    {
    if ((window.event.keyCode < 48) || (window.event.keyCode > 57))
    window.event.keyCode = 0;
    }

    //if there are any data in the ticket number textbox, add an "all"
    option to the reservation date combo box
    function txtTicketNumber_onchange()
    {
    var indexOfAll;

    if (txtTicketNumber.value == '')
    {
    //if "all" is the currently selected value, reset to "current"
    if (cboReservationDate.value == '999')
    cboReservationDate.value = '0';

    //remove "all" option from date combo if it exists
    if ((indexOfAll = indexOfAllOption()) > -1)
    cboReservationDate.options.remove(indexOfAll);
    }
    else
    {
    //add "all" option to date combo if it is not already there
    if ((indexOfAll = indexOfAllOption()) == -1)
    {
    var oAllOption = document.createElement('OPTION');
    oAllOption.text = 'All';
    oAllOption.value = '999';

    cboReservationDate.options.add(oAllOption);
    }
    }
    }

    function indexOfAllOption()
    {
    for (i=0; i < cboReservationDate.options.length; i++)
    if (cboReservationDate.options.value == '999')
    return i;

    return -1;
    }

    Thanks in advance to anyone who can help!

    Regards,

    Jon.

    *** Sent via Developersdex http://www.developersdex.com ***
    Don't just participate in USENET...get rewarded for it!
     
    Jonathan Parkes, Feb 16, 2004
    #1
    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. Ravikanth[MVP]

    Focussing Text Box Control

    Ravikanth[MVP], Aug 21, 2003, in forum: ASP .Net
    Replies:
    2
    Views:
    395
    Vidar Petursson
    Aug 21, 2003
  2. HANM
    Replies:
    2
    Views:
    753
    Joseph Kesselman
    Jan 29, 2008
  3. Covad
    Replies:
    1
    Views:
    216
    Richard Cornford
    Nov 3, 2003
  4. palmiere
    Replies:
    1
    Views:
    453
    Erwin Moller
    Feb 9, 2004
  5. Replies:
    2
    Views:
    184
    rehevkor5
    Jun 29, 2006
Loading...

Share This Page