Search jQuery

jQuery Forum

selectmenu

in Using jQuery UI • 8 years ago

selectmenu not tranfer the onchange from original select to change and not automaticaly add a scrolbar if needed.

older versions of selectmenu do's that, its a simple way to simulate this functionality in version.1.11.

Replies(7)

jakecigar

Re: selectmenu

8 years ago

The event is now selectmenuchange . So you would have to trigger the original change event .

Something like

    
      
          $( ".selector" ).selectmenu({
  change: function( event, ui ) {    $(this).trigger("change")  }
});

JΛ̊KE

the_cat

Re: selectmenu

7 years ago

Thanks so much for this, it sorted my problem out, but I do take issue with the fact of having to do this. The functional spec for this control says "selectmenu will act as a proxy back to the original select element, controlling its state for form submission or serialization"

so one would assume that changing it will in turn pass a change event back to the original. In fact the source code does attempt to do this as there's a comment: // Change native select element

which then goes on to trigger the change event for the original select (although instead of calling "change" it is calling "selectmenuchange" - which the original select doesn't understand).

Is this a bug?

jakecigar

Re: Re: selectmenu

7 years ago

JΛ̊KE

the_cat

Re: selectmenu

7 years ago

Maybe it's a "feature" then!?

Given that the spec says the change event should be reflected in the original SELECT, I would expect this code to work:

<!doctype html>
<html lang="en">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Select test</title>
<link rel="stylesheet" type="text/css" href="https://code.jquery.com/ui/1.11.4/themes/ui-lightness/jquery-ui.css" />
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.3.min.js"></script>
<script type="text/javascript" src="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script>
<script type="text/javascript">
$(function() {
$('#Select').selectmenu( { width: 150} ).change(function(){
alert(this.value);
});
});
</script>
</head>
<body>
<select class="selectmenu" id="Select">
<option value="A">Option A</option>
<option value="B">Option B</option>
<option value="C">Option C</option>
</select>
</body>
</html>

And trigger an alert every time the drop down changes.

I'm not familiar with the jQueryUI code, but hacking it at line 799 within the _trigger function:

  event.type = ( type === this.widgetEventPrefix ?
   type :
   this.widgetEventPrefix + type ).toLowerCase();
// new code below
  if ( event.type === "selectmenuchange") {
    event.type = "change";
  }

To force the correct event, works. But that doesn't seem right, so I'd really be interested in why you think this isn't a bug?

jakecigar

Re: Re: selectmenu

7 years ago

I remember using change, and I understand your patch.

BUT, all the jQuery UI and jQuery Mobile widgets use made up event names, now. Perhaps there was a problem with some version of some browser or they just wanted to clean things up.

JΛ̊KE

the_cat