jQWidgets Forums

Tagged: AutoComplete, jqxinput

This topic contains 5 replies, has 3 voices, and was last updated by wavetrex 12 years, 2 months ago.

Viewing 6 posts - 1 through 6 (of 6 total)

Author

jqxInput problem in 2.7 Posts

March 12, 2013 at 12:38 pm jqxInput problem in 2.7 #16795

Tony C

Participant

Hi,

I have the following auto-complete which works perfectly in 2.61.

I updated to 2.7 and now there are no suggestions appearing under the input field. There are no errors logged in the console & I can see in firebug that the suggestions are being returned correctly from the web service. I reverted to 2.61 and the suggestions appear again.

Has something changed between 2.61 and 2.7 that I am missing, or is my definition bad/incomplete ?

thanks & regards

Tony C

	$("#xtrdist").jqxInput({
		placeHolder : "cust name or number",
		height : 25,
		width : 300,
		theme : theme,
		source : function(query, response) {
			var dataAdapter = new $.jqx.dataAdapter({
				datatype : "json",
				datafields : [{
					name : 'id',
					type : 'string'
				}, {
					name : 'name',
					type : 'string'
				}],
				id : 'id',
				url : '/wiaweb/custsuggj.pgm',
				data : {
					query : "none"
				}
			}, {
				autoBind : true,
				formatData : function(data) {
					data.query = query;
					return data;
				},
				loadComplete : function(data) {
					//console.log(data);
					if (data.records.length > 0) {
						response($.map(data.records, function(item) {
							return {
								label : item.name
							}
						}));
					}
				}
			});
		}
	});

March 12, 2013 at 1:08 pm jqxInput problem in 2.7 #16804

Peter Stoev

Keymaster

Hi Tony C,

The only change in jqxInput is that in jQWidgets 2.7, the popup is positioned below the input with absolute position. If you have content with higher z-index than the input, it could be displayed behind it.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

March 13, 2013 at 1:17 am jqxInput problem in 2.7 #16886

wavetrex

Participant

Yeh, I encountered the same issue and reported it a little while back.

There is a temporary workaround for it until it will be solved, add this to your styles:

.jqx-menu {
z-index: 100000;
}

March 13, 2013 at 6:11 am jqxInput problem in 2.7 #16892

Tony C

Participant

Thanks wavetrex, that kludge solved the problem

below is my cut down code that demonstrates of the problem. The window (myWin) is created with a z-index of 9001, once typing into the field (myField) commences, the suggestions are created in the DOM at the correct absolute position, but with no z-index (i.e. auto), therefore they are unseen.

<!DOCTYPE html>
<html>
	<head>
    <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" />
    <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/jqxinput.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxwindow.js"></script>
	</head>
	<body>
	<script type="text/javascript">
		var countries = new Array("Afghanistan", "Albania", "Algeria", "Andorra", "Angola", "Antarctica", "Antigua and Barbuda", "Argentina", "Armenia", "Australia", "Austria", "Azerbaijan", "Bahamas", "Bahrain", "Bangladesh", "Barbados", "Belarus", "Belgium", "Belize", "Benin", "Bermuda", "Bhutan", "Bolivia", "Bosnia and Herzegovina", "Botswana", "Brazil", "Brunei", "Bulgaria", "Burkina Faso", "Burma", "Burundi", "Cambodia", "Cameroon", "Canada", "Cape Verde", "Central African Republic", "Chad", "Chile", "China", "Colombia", "Comoros", "Congo, Democratic Republic", "Congo, Republic of the", "Costa Rica", "Cote d'Ivoire", "Croatia", "Cuba", "Cyprus", "Czech Republic", "Denmark", "Djibouti", "Dominica", "Dominican Republic", "East Timor", "Ecuador", "Egypt", "El Salvador", "Equatorial Guinea", "Eritrea", "Estonia", "Ethiopia", "Fiji", "Finland", "France", "Gabon", "Gambia", "Georgia", "Germany", "Ghana", "Greece", "Greenland", "Grenada", "Guatemala", "Guinea", "Guinea-Bissau", "Guyana", "Haiti", "Honduras", "Hong Kong", "Hungary", "Iceland", "India", "Indonesia", "Iran", "Iraq", "Ireland", "Israel", "Italy", "Jamaica", "Japan", "Jordan", "Kazakhstan", "Kenya", "Kiribati", "Korea, North", "Korea, South", "Kuwait", "Kyrgyzstan", "Laos", "Latvia", "Lebanon", "Lesotho", "Liberia", "Libya", "Liechtenstein", "Lithuania", "Luxembourg", "Macedonia", "Madagascar", "Malawi", "Malaysia", "Maldives", "Mali", "Malta", "Marshall Islands", "Mauritania", "Mauritius", "Mexico", "Micronesia", "Moldova", "Mongolia", "Morocco", "Monaco", "Mozambique", "Namibia", "Nauru", "Nepal", "Netherlands", "New Zealand", "Nicaragua", "Niger", "Nigeria", "Norway", "Oman", "Pakistan", "Panama", "Papua New Guinea", "Paraguay", "Peru", "Philippines", "Poland", "Portugal", "Qatar", "Romania", "Russia", "Rwanda", "Samoa", "San Marino", " Sao Tome", "Saudi Arabia", "Senegal", "Serbia and Montenegro", "Seychelles", "Sierra Leone", "Singapore", "Slovakia", "Slovenia", "Solomon Islands", "Somalia", "South Africa", "Spain", "Sri Lanka", "Sudan", "Suriname", "Swaziland", "Sweden", "Switzerland", "Syria", "Taiwan", "Tajikistan", "Tanzania", "Thailand", "Togo", "Tonga", "Trinidad and Tobago", "Tunisia", "Turkey", "Turkmenistan", "Uganda", "Ukraine", "United Arab Emirates", "United Kingdom", "United States", "Uruguay", "Uzbekistan", "Vanuatu", "Venezuela", "Vietnam", "Yemen", "Zambia", "Zimbabwe");
		$(document).ready(function() {
			$("#myWin").jqxWindow({
				width : 450,
				height : 300,
				resizable : false,
				autoOpen : false
			});
			$("#myField").jqxInput({
				placeHolder : "enter country",
				height : 25,
				width : 250,
				source : countries
			});
			$("#myWin").jqxWindow('show');
		})
	</script>
		<div id="myWin">
			<div>
				Pick a Country Window
			</div>
			<div>
				Country
				<input id="myField" />
			</div>
		</div>
	</body>
</html>

March 23, 2013 at 3:12 am jqxInput problem in 2.7 #17816

Tony C

Participant

fixed in 2.8 release, thanks

March 25, 2013 at 8:26 pm jqxInput problem in 2.7 #17979

wavetrex

Participant

Confirmed, it has been solved in 2.8

Now the Z-Index for the menu is set automatically ( in my case it’s 20000 ).

Can be closed, thanks !

Author

Posts

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.