Jump to content

What event is fired when a drop down entry is selected for a textbox?


sepoto
 Share

Recommended Posts

Does anyone know what event is fired when a Dropdown entry is selected for an input of type Textbox? I am using the AutoComplete Widget of the jQuery UI and I am attempting to perform some functions on the style of the Textbox when a user selects one of the entries. P.S. I'm also wondering is there a way a can track which events are being triggered as I use controls on the page perhaps maybe Google Chrome Developer Tools or FireFox Develpor Tools have this functionality?

Edited by sepoto
Link to comment
Share on other sites

Possibly the onchange event, but if this is autocomplete I'm not sure if there's a standard for it.Normally, for text inputs, the onchange event only fires the moment the field loses focus. The only way I know to test events is to actually put multiple event handlers on the element and check which ones are fired.

Link to comment
Share on other sites

I tried a select tag in a form. When I used the onchange event with it and directed it to a function with form.submit() it didn't post. The onchnage would work to alter value in javascript but I couldn't get it to post. If you figure it out let me know. Good luck.

  • Like 1
Link to comment
Share on other sites

 <!doctype html><html lang="en"><head>    <meta charset="utf-8" />    <title>jQuery UI Autocomplete - Default functionality</title>    <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css" />    <script src="http://code.jquery.com/jquery-1.8.3.js"></script>    <script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>    <link rel="stylesheet" href="/resources/demos/style.css" />    <script>    $(function() {        var availableTags = [            "ActionScript",            "AppleScript",            "Asp",            "BASIC",            "C",            "C++",            "Clojure",            "COBOL",            "ColdFusion",            "Erlang",            "Fortran",            "Groovy",            "Haskell",            "Java",            "JavaScript",            "Lisp",            "Perl",            "PHP",            "Python",            "Ruby",            "Scala",            "Scheme"        ];         $( "#tags" ).autocomplete({            source: availableTags        });      });    </script></head><body> <div class="ui-widget">    <label for="tags">Tags: </label>    <input id="tags" /></div> <script>$("#tags").change(function() {alert('Handler for .change() called.');});</script></body></html>

It isn't working yet. This is what I have. I think if I work with it some more it could potentially be the answer nut it just isn't yet...

Link to comment
Share on other sites

http://docs.jquery.c....8/Autocompleteautocompleteselect event? => http://docs.jquery.com/UI/API/1.8/Autocomplete#event-select Edited by thescientist
  • Like 1
Link to comment
Share on other sites

This code is quite functional. I really like it. Thank you thescientist for pointing this out to me.

 <!DOCTYPE html><html><head><link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script><script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script> <script>$(document).ready(function() {$("input#autocomplete").autocomplete({source: ["c++", "java", "php", "coldfusion", "javascript", "asp", "ruby"]});});</script> </head><body style="font-size:62.5%;"> <input id="autocomplete" /> <script>$( "input#autocomplete" ).autocomplete({   select: function(event, ui) { alert("Alert!"); }});</script></body></html>

Edited by sepoto
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...