Initial display problem

[aorlicMember]

Hello!

I have this small issue with the display of the NavigationBar. One of the initially closed sections is not fully closed on initial display. If I open this section and close it manually, it is displayed fine.

Plase take a lok at the following image, it has 2 examples of the same problem in two different widgets (marked in red).

Thank you,

Aleks.

[DimitarParticipant]

Hello aorlic,

With the latest version of jQWidgets (2.5.5), we were not able to reproduce the reported issue. Please, update and share your feedback.

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/

[aorlicMember]

Unfortunatelly it is still there with the new version. On all browsers.

Here is the significant part of the code:

		<div id='pra_nav_filter'>
			<div>Text search</div><div>
				<table width='100%'>
					<tr>
						<td width='35%'>Text:</td>
						<td> 
							<input id="npr_txt_keywords" type="text" style="margin:2px;"/>
						</td>
					</tr>
					<tr>
						<td></td>
						<td>
							<div id='pra_chk_search_in_alias'>Search in alias</div>
							<div id='pra_chk_search_in_name'>Search in name</div>
						</td>
					</tr>
				</table>
			</div>
			<div>Status and time</div><div>
				<table width='100%'>
					<tr>
						<td width='35%'>Status:</td>
						<td> 
							<div id='pra_chk_open'>Open</div>
							<div id='pra_chk_running'>Running</div>
							<div id='pra_chk_closed'>Closed</div>
						</td>
					</tr>
					<tr style='margin-top: 15px;'>
						<td width='30%'>Start after:</td>
						<td><div id="pra_cal_after"></div></td>
					</tr>
					<tr>
						<td width='30%'>Start before:</td>
						<td><div id="pra_cal_before"></div></td>
					</tr>
				</table>
			</div>
			<div>Team</div><div>content</div>
			<div>Performance</div><div>content</div>
		</div>
		
and the script...		
			$('#pra_nav_filter').jqxNavigationBar({ width: '100%', theme: PMD.theme });
				// Text search filter
				$("#pra_chk_search_in_alias").jqxCheckBox({ checked: true, animationShowDelay:100, animationHideDelay:100, theme: PMD.theme });
				$("#pra_chk_search_in_name").jqxCheckBox({ checked: true, animationShowDelay:100, animationHideDelay:100, theme: PMD.theme });
				
				// Status and time filter
				$("#pra_chk_open").jqxCheckBox({ checked: true, animationShowDelay:100, animationHideDelay:100, theme: PMD.theme });
				$("#pra_chk_running").jqxCheckBox({ checked: true, animationShowDelay:100, animationHideDelay:100, theme: PMD.theme });
				$("#pra_chk_closed").jqxCheckBox({ checked: true, animationShowDelay:100, animationHideDelay:100, theme: PMD.theme });
				$('#pra_cal_after').jqxDateTimeInput({ theme: PMD.theme, height: 22, value: null });
				$('#pra_cal_before').jqxDateTimeInput({ theme: PMD.theme, height: 22, value: $.jqx._jqxDateTimeInput.getDateTime(new Date()) });
				
				// filter button
				$('#pra_btn_filter').jqxButton({ width: '100%', height: '30px', theme: PMD.theme });
		

[DimitarParticipant]

Hi aorlic,

Here is a slightly updated version of your example in jsFiddle (with code). Please check it out and share if you experience any issues.

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/

[aorlicMember]

Thank you Dimitar, this solved the problem. Thank you very much for the effort and express-help.

[Author]

Posts