sepoto Posted December 4, 2012 Share Posted December 4, 2012 (edited) 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 December 4, 2012 by sepoto Link to comment Share on other sites More sharing options...
Ingolme Posted December 4, 2012 Share Posted December 4, 2012 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 More sharing options...
davej Posted December 5, 2012 Share Posted December 5, 2012 I have been wondering about that myself, but so far I have not needed to figure it out. Onchange? Mouseup? Link to comment Share on other sites More sharing options...
demuro1 Posted December 6, 2012 Share Posted December 6, 2012 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. 1 Link to comment Share on other sites More sharing options...
sepoto Posted December 6, 2012 Author Share Posted December 6, 2012 <!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 More sharing options...
justsomeguy Posted December 6, 2012 Share Posted December 6, 2012 You'll need to look through the autocomplete code to see exactly what it's doing. It may add support for its own new events or callbacks. Link to comment Share on other sites More sharing options...
thescientist Posted December 6, 2012 Share Posted December 6, 2012 (edited) http://docs.jquery.c....8/Autocompleteautocompleteselect event? => http://docs.jquery.com/UI/API/1.8/Autocomplete#event-select Edited December 6, 2012 by thescientist 1 Link to comment Share on other sites More sharing options...
sepoto Posted December 6, 2012 Author Share Posted December 6, 2012 (edited) 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 December 6, 2012 by sepoto Link to comment Share on other sites More sharing options...
Recommended Posts
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 accountSign in
Already have an account? Sign in here.
Sign In Now