jQWidgets Forums
jQuery UI Widgets › Forums › Lists › ComboBox › Text value
Tagged: combobox, Input, jqxComboBox, value
This topic contains 2 replies, has 2 voices, and was last updated by nosn 12 years, 3 months ago.
Viewing 3 posts - 1 through 3 (of 3 total)
-
AuthorText value Posts
-
Is there a way to grab the text value of the input box ( I.e. user typed in input instead of selecting an item )?
thanks,
nosnHello nosn,
Here is how to get the value in the input:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <meta name="keywords" content="jQuery ComboBox, List, ListBox, Popup List, jqxComboBox, jqxListBox, List Widget, ListBox Widget, DropDownList Widget" /> <meta name="description" content="The jqxComboBox in this demo is populated with items and show how to display image next to each item." /> <title id='Description'>The jqxComboBox represents a widget that contains a list of selectable items displayed in a drop-down. Users can enter information in the text box portion and search for a specific item. The widget comes with built-in auto-complete support.</title> <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" /> <script type="text/javascript" src="../../scripts/gettheme.js"></script> <script type="text/javascript" src="../../scripts/jquery-1.8.2.min.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxbuttons.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxscrollbar.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxlistbox.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxcombobox.js"></script></head><body> <div id='content'> <script type="text/javascript"> $(document).ready(function () { var theme = getTheme(); var source = new Array(); for (i = 0; i < 10; i++) { var movie = 'avatar.png'; var title = 'Avatar'; var year = 2009; switch (i) { case 1: movie = 'endgame.png'; title = 'End Game'; year = 2006; break; case 2: movie = 'priest.png'; title = 'Priest'; year = 2011; break; case 3: movie = 'unknown.png'; title = 'Unknown'; year = 2011; break; case 4: movie = 'unstoppable.png'; title = 'Unstoppable'; year = 2010; break; case 5: movie = 'twilight.png'; title = 'Twilight'; year = 2008; break; case 6: movie = 'kungfupanda.png'; title = 'Kung Fu Panda'; year = 2008; break; case 7: movie = 'knockout.png'; title = 'Knockout'; year = 2011 break; case 8: movie = 'theplane.png'; title = 'The Plane'; year = 2010; break; case 9: movie = 'bigdaddy.png'; title = 'Big Daddy'; year = 1999; break; } var html = "<div style='padding: 0px; margin: 0px; height: 95px; float: left;'><img width='60' style='float: left; margin-top: 4px; margin-right: 15px;' src='../../images/" + movie + "'/><div style='margin-top: 10px; font-size: 13px;'>" + "<b>Title</b><div>" + title + "</div><div style='margin-top: 10px;'><b>Year</b><div>" + year.toString() + "</div></div></div>"; source[i] = { html: html, title: title }; } // Create a jqxComboBox $("#jqxWidget").jqxComboBox({ source: source, selectedIndex: 0, width: '250', height: '25px', theme: theme }); // alerts the value in the widget's input $("#getValueButton").click(function () { var value = $("#jqxWidget input").val(); alert(value); }); }); </script> <div id='jqxWidget'> </div> <button id="getValueButton"> Get value</button> </div></body></html>
Best Regards,
DimitarjQWidgets team
http://www.jqwidgets.com/Thank you. That answered my question.
-nosn
-
AuthorPosts
Viewing 3 posts - 1 through 3 (of 3 total)
You must be logged in to reply to this topic.