jQWidgets Forums
jQuery UI Widgets › Forums › General Discussions › Lists › ComboBox › select item when user types code in combo
Tagged: AutoComplete, combobox, jqxComboBox, selectIndex
This topic contains 1 reply, has 2 voices, and was last updated by Dimitar 11 years, 7 months ago.
-
Author
-
Hi.
There is a problem when user take steps like below:
1. Select code from list box: for example 2
2. Click into combo and with backspace deletes code 2 and with keyboard press 3 and select item three from list box
3. Press button and code to select item does not work.
Problem is when user types code into combo.Sample code:
<!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> <title id='Description'>Test ComboBox</title> <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" /> <script type="text/javascript" src="../../scripts/jquery-1.10.2.min.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxdata.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 = ""; var source = new Array(); for (i = 0; i < 6; i++) { var code = '0'; var value = 'value 0'; switch (i) { case 1: code = '1'; value = 'value 1'; break; case 2: code = '2'; value = 'value 2'; break; case 3: code = '3'; value = 'value 3'; break; case 4: code = '4'; value = 'value 4'; break; case 5: code = '5'; value = 'value 5'; break; } source[i] = { code: code, value: value }; } var sourceTD = { localdata : source, datatype : 'array' }; indexToSelect = -1; var daTD = new $.jqx.dataAdapter(sourceTD); $('#jqxcombo').jqxComboBox({ source : daTD, selectedIndex : indexToSelect, animationType : 'none', width : 149, height : 22, dropDownWidth : 700, displayMember : 'code', valueMember : 'code', placeHolder : 'Vnesi ...', autoComplete : true, renderer : function (index, label, value) { var item = source[index]; if (item != null) { return item.code + ' - ' + item.value; } return ''; } }); $('#input').val(''); $('#jqxcombo').on('select', function (event) { var args = event.args; if (args) { var item = args.item; if (item && item.originalItem) { $('#input').val(item.originalItem.code + ' - ' + item.originalItem.value); } } }); $('#jqxButton').jqxButton({ width: '150', theme: theme }); // set selected item on 5 $('#jqxButton').on('click', function () { $('#jqxcombo').jqxComboBox('selectIndex', 5); alert('selected item must be 5'); }); }); </script> <div id='jqxcombo'></div> <br /> <div> <input id="input" type="text" /> </div> <br /> </div> <input type="button" value="Button" id='jqxButton' /> </div> </div> </body> </html>
Regards,
DamcHello Damc,
Thank you for your feedback. We confirm the reported issue and will fix it as soon as possible. It is related to the autoComplete property and if you set it to false, everything should work fine.
Best Regards,
DimitarjQWidgets team
http://www.jqwidgets.com/ -
AuthorPosts
You must be logged in to reply to this topic.