Search code examples
dartpolymerpaper-elements

Dart PaperDropdownMenu getting selected item


I'm kind of struggling getting the selected item id or even the text displayed in a dropdown menu list. Here's my code:

HTML:
      <paper-dropdown-menu  label="Currency" on-core-select="{{selectCurrency}}">
        <paper-dropdown class="dropdown" halign='right'>
          <core-menu class="menu"  selected="{{selectedCurrency}}">
            <template repeat="{{c in currencies}}">
              <paper-item>{{c}}</paper-item>
            </template>
          </core-menu>
        </paper-dropdown>
      </paper-dropdown-menu>

Dart:

void selectCurrency(CustomEvent e, var detail, PaperDropdownMenu m) {
    var id = m.getAttribute("selected");
    //id = mCurrencyDropdown.selected;
    JsObject detail = new JsObject.fromBrowserObject(e)['detail'];

    if(detail['isSelected']) {
        PaperItem selected =  detail['item'] as PaperItem;

        print( 'source | $selected' );
    }

  print(detail);

}

I can see several properties from which I might get the information I want but I can't access them as the don't seem to be public: https://drive.google.com/file/d/0B9-4jVIpB0XuTXJ5eVBMZllyanM/view

Any idea? Thank you!

Thanks to Günter I have found the answer:

I have an observable like this:

@observable int selectedCurrency = 20;

Apparently you can simply add a method to your class matching the members name like this and it's called each time the observable is changed:

selectedCurrencyChanged(var oldValue, var newValue) { 
    print(newValue);
}

Official Documentation


Solution

  • Where is the field selectedCurrency you have bound to ?

    I guess you can drop the on-core-select event handler entirely and instead add a method

    selectedCurrencyChanged(newValue) { 
      // event handler code here 
    }