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 8 of 8
  1. #1
    New Coder
    Join Date
    Dec 2010
    Posts
    27
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Dropdown change event not getting recent value

    Hi,
    I am havving issues with dropdown change event functionality. I am using YUI 2 in code and I dont get current value in "change" event handler of dropdown. I will try to add code.
    function loadValues is called with certain input which is used to determine what values show up in dropdown list. Inside this method, there is event handler for "change" event, which also needs this value as input and perform some logic.

    var loadValues = function(inputValue) {
    // Some logic to use inputValue and populate dropdown list having Id of "DomId"
    hookupHandler(inputValue);
    }

    var hookupHandler = function(inputValue) {
    if(!Event.getListeners('DomId', 'change')) {
    Event.addListener('DomId', 'change', function() {
    alert(inputValue);
    });
    }
    }

    When I call loadValues(6), dropdown gets populated with certain values, change event gets hooked.
    Next I call loadValues(2), dropdown gets repopulated with certain values and change event handler is already hooked. However now I change selection in dropdown, change event handler is fired and alerts the value 6 which was the previous value of inputValue. Since the most recent value of inputValue is 2, changing selected value in dropdown should alert the new value 2 and not old value 6.

    Please suggest, I have been trying for 2 days now and cannot figure this out. I expect most recent value to show up (2 in this case).

    thankful for help in advance.

  • #2
    Regular Coder
    Join Date
    Mar 2008
    Location
    London
    Posts
    152
    Thanks
    4
    Thanked 42 Times in 42 Posts
    I think the IF condition within hookuphandler is creating this problem. If you eliminate that condition, your problem will be solved.

    So, the new code would be something like this -
    Code:
    var hookupHandler = function(inputValue) {
      Event.addListener('DomId', 'change', function() {
        alert(inputValue);
      });
    }
    May be this may help you out...

  • #3
    New Coder
    Join Date
    Dec 2010
    Posts
    27
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Thank you for looking at this. I have tried removing If condition and now it alerts 6 first and then 2. Without If condition, it registers event handler twice and fires for all previous values.

    Other ideas?

  • #4
    Senior Coder
    Join Date
    Apr 2011
    Location
    London, England
    Posts
    2,120
    Thanks
    15
    Thanked 354 Times in 353 Posts
    The issue is to do with closures and scope. This might work:
    Code:
    var hookupHandler = function(inputValue) {
        if(!Event.getListeners('DomId', 'change')) {
            var keepPrevious = inputValue;
            Event.addListener('DomId', 'change', function() {
                alert(keepPrevious);
            });
        }
    }
    "I'm here to save your life. But if I'm going to do that, I'll need total uninanonynymity." Me Myself & Irene.
    Validate your HTML and CSS

  • #5
    New Coder
    Join Date
    Dec 2010
    Posts
    27
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Hi Andrew, thank u for looking at this. By using keepPrevious code will end up keeping previous value which it is already doing. I actually want to keep the newest value. Like in the example, using keepPrevious will alert 6 but I want 2 to be alerted because that is the most recent value passed to the method.

  • #6
    Senior Coder
    Join Date
    Apr 2011
    Location
    London, England
    Posts
    2,120
    Thanks
    15
    Thanked 354 Times in 353 Posts
    Quote Originally Posted by kaanta View Post
    Hi Andrew, thank u for looking at this. By using keepPrevious code will end up keeping previous value which it is already doing. I actually want to keep the newest value. Like in the example, using keepPrevious will alert 6 but I want 2 to be alerted because that is the most recent value passed to the method.
    I'm assuming, then, that you want to remove the previous event-listener: removeEventListener. Otherwise, your code will only create the first listener (on the value 6).

    Alternatively, it is possible to pass an argument to an event-handler, but I don't have an example immediately to hand.
    "I'm here to save your life. But if I'm going to do that, I'll need total uninanonynymity." Me Myself & Irene.
    Validate your HTML and CSS

  • #7
    Senior Coder
    Join Date
    Apr 2011
    Location
    London, England
    Posts
    2,120
    Thanks
    15
    Thanked 354 Times in 353 Posts
    If YUI has addListener then presumably it has an alternative to removeEventListener?

    Code:
    var hookupHandler = function(inputValue) {
        var theHandler = function () {
            alert(inputValue);
        };
        if(Event.getListeners('DomId', 'change')) {
            document.getElementById('DomId').removeEventListener('change', theHandler);
            // or.. presume you have an Event. equivalent to removeEventListener..?
        }
        Event.addListener('DomId', 'change', theHandler);
    }
    "I'm here to save your life. But if I'm going to do that, I'll need total uninanonynymity." Me Myself & Irene.
    Validate your HTML and CSS

  • Users who have thanked AndrewGSW for this post:

    kaanta (12-29-2012)

  • #8
    New Coder
    Join Date
    Dec 2010
    Posts
    27
    Thanks
    1
    Thanked 0 Times in 0 Posts
    I tried passing argument to event handler but that still takes the old value and not the new. I have now added removeListener as you suggested. I check for listener if available, then remove it and re-add it and then it gets bound with the latest value and works as desired. downside is that remove and add happens everytime. However I dont see any issue with that in terms of performance or functionality at this time.

    Thanks for your help.


  •  

    Posting Permissions

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