Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    May 2006
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Drop Down Box & Alert Message anomaly

    I'll try to make this a unconfusing as possible.

    I have 2 drop down boxes in an ASP form. Box A is a list of job titles matching params selected from other fields. Box B is a listing of ALL job titles regardless of params from other fields. The idea is that if a job title is not listed in A but needs to be added, the person can select the job title from box B and it will be added to box A.

    This works to a certain extent. If a title is selected from box b, it is added to box A without a problem. However, I can't set box A to the new value using .selected UNLESS i have a JS alert statement. Without the alert statement, the title is added to box A, but is then not set to the newly added value. makes no sense to me. does the alert function in JS call some other event or method behind the scenes without actually doing a form / page refresh?

    I don't want to do a form reload, post, or refresh unless I absolutely have to because of the number of other things I would have to pass back to the form. If I can determine what alert does to force box a to update and select the added title from box b, I think I should be able to implement that instead?

    Below is the function that updates box a with a value from box b (I understand normally, people work left to right, but in my page there are a number of boxes to the left - each box to the right is populated from database values depending on what was selected to the left. At the end, if the job title is not listed, the user is allowed to select a title not present.) I work in a shipyard so people do change titles on a regular basis (i.e. back to craft from supervisor if workload starts to decline).

    The first is with the alert statement, the second without.


    This will allow the title from box B to be added to Box A, but but Box A will not treat the newly added title as selected

    function copyComboElements(sourceCombo,targetCombo)
    {
    var i = sourceCombo.selectedIndex;
    var sup = sourceCombo.options[i].text;
    var myEle;
    myEle = document.createElement("option") ;
    myEle.setAttribute('value',sup, true);
    var txt = document.createTextNode(sup);
    myEle.appendChild(txt);
    targetCombo.appendChild(myEle);

    document.getElementById ("selJTitle").value = document.getElementById ("selJTitle")[targetCombo.length - 1].value;

    }// end function


    This will allow the title from box B to be added to Box A, and will treat the newly added title as selected


    function copyComboElements(sourceCombo,targetCombo)
    {
    var i = sourceCombo.selectedIndex;
    var sup = sourceCombo.options[i].text;
    var myEle;
    myEle = document.createElement("option") ;
    myEle.setAttribute('value',sup, true);
    var txt = document.createTextNode(sup);
    myEle.appendChild(txt);
    targetCombo.appendChild(myEle);

    alert("nothing special");

    document.getElementById ("selJTitle").value = document.getElementById ("selJTitle")[targetCombo.length - 1].value;


    }// end function

  • #2
    Senior Coder
    Join Date
    Jul 2005
    Location
    New York, NY
    Posts
    1,084
    Thanks
    4
    Thanked 19 Times in 19 Posts
    well first, you should be using the options collection on the select box:
    Code:
    var selJ = document.getElementById ("selJTitle");
    selJ.value = selJ.options[targetCombo.length - 1].value;
    But I have also run into this problem. It's because some things are actually executed in a deferred manner in the browser, so alerting gives the browser time to catch up. I've solved it usually by calling form.reset() though you may not be at liberty to reset the form at that time.

    Try a few different calls in there, alert won't be the only one that solves it.

  • #3
    New to the CF scene
    Join Date
    May 2006
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks. Probably not the most efficient (I'm not an expert programmer by any means), but exploring the idea of trying a few other events, another programmer and I came up with the following (copyElements() is called from box B via the onChange event):


    function copyElements()
    {
    var z = document.title.selAltTitle.selectedIndex;
    var str = document.title.selAltTitle.options[z].text;

    copyComboElements(document.title.selAltTitle, document.title.selJTitle);

    document.title.selJTitle.blur();
    document.title.selJTitle.focus();

    selectOption(document.getElementById ("selJTitle"), str);

    document.getElementById ("save").style.display = '';
    document.getElementById ("row4").style.display = 'none';

    }// end function

    function select(list, i)
    // Set an option to the selected state in a combobox
    // based on the location that is passed into this
    // function.
    {
    if (list.selectedIndex != i) list.selectedIndex = i;
    }

    function selectOption(comboBox,searchVal)
    // Select an option in a combobox based on a value
    // that is passed into this function.
    {
    var list = comboBox;
    var str = searchVal;

    if (str == "")
    {
    select(list, 0);
    return;
    }// end if

    if (str == null)
    {
    select(list,0);
    return;
    }// end if

    for (var i = 0; i < list.options.length; ++i)
    {
    if (list.options[i].text.indexOf(str) == 0)
    {
    select(list, i);
    return;
    }// end if
    }// end for
    }// end function


    function copyComboElements(sourceCombo,targetCombo)
    {
    var i = sourceCombo.selectedIndex;
    var sup = sourceCombo.options[i].text;
    var myEle;

    myEle = document.createElement("option") ;
    myEle.setAttribute('value',sup);
    var txt = document.createTextNode(sup);
    myEle.appendChild(txt);
    targetCombo.appendChild(myEle);

    }// end function


    Thank you for pointing me in the right direction! :-)


  •  

    Posting Permissions

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