jqxDropDownList not locked with control

[NetManParticipant]

Greetings,

When the DropDownList is dropped down and then the browser window is resized(IE8-IE11) the DropDownList does not lock down and move with the Dropdown control. I see this does not happen in your default demo code so I’m not sure why this happens. We are using v3.2.1

Appreciate any advice.
Regards,
NetMan

[DimitarParticipant]

Hello NetMan,

Could you, please share a JSFiddle example demonstrating the issue? Please also make sure you are using the latest version of jQWidgets (3.4.0).

Best Regards,
Dimitar

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

[NetManParticipant]

I upgraded to the latest version of JQWidgets – 3.4.0 and latest jQuery 1.11.1 but the dropdown will still not move with the control. The MVC view is a bit difficult to get to work at all in JSFiddle.

Regards,
NetMan

[DimitarParticipant]

Hi NetMan,

Maybe you will be able to reproduce the issue on a smaller scale and share the code here? If this is not possible either, just post a code snippet from your MVC project which is relevant to the dropdownlist (JavaScript initialization and HTML).

Best Regards,
Dimitar

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

[NetManParticipant]

Hi, we tried it also without the iframe and it does the same thing. This should be all the pertinent code.
Regards, NetMan

<table cellpadding=”0″ cellspacing=”0″ class=”BorderlessTable” style=”width: 100%;”>
<tr>
<td>
@Html.LabelFor(model => model.AgencyId)
</td>
<td>
<div id=’jqxAgencyDropdown’>
</div>
</td>
</tr>
</table>
$(document).ready(function () {
var agencies = [];
var result = ‘@Html.Raw(Json.Encode(Model.Agencies))’

var obj = $.parseJSON(result);
$.each(obj, function (index) {
agencies.push({
key: obj[index].Text,
value: obj[index].Value
});
});

$(“#jqxAgencyDropdown”).jqxDropDownList({
source: agencies, displayMember: “key”, valueMember: “value”, width: 450, height: 25, theme: ‘ui-redmond’, placeHolder: ‘Select an Agency’, autoDropDownHeight: true, popupZIndex: 0
});
var item = $(“#jqxAgencyDropdown”).jqxDropDownList(‘getItemByValue’, “@Model.AgencyId”);
$(“#jqxAgencyDropdown”).jqxDropDownList(‘selectItem’, item);
$(“#innerListBoxjqxAgencyDropdown”).append(‘<iframe class=”cover” src=”about:blank”></iframe>’);

$(‘input:text’).bind(‘keyup blur’,
function (e) {
if (e.type == ‘keyup’)
this.value = this.value.toLocaleUpperCase();
$(“form”).jqxValidator(‘updatePosition’);
});
});
$(window).resize(function () {
$(‘form’).jqxValidator(‘updatePosition’);
});

[DimitarParticipant]

Hi NetMan,

Actually, this is not an issue on your side. The pop-up has an absolute position and does not move along with its parent widget automatically when the browser window is resized.

Best Regards,
Dimitar

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

[NetManParticipant]

Hi Dimitar,

Why do I not see that behavior in the demo, or am I missing something?

Regards,
Warren

[DimitarParticipant]

Hi Warren,

It is because the demos are shown in iframes.

Best Regards,
Dimitar

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

[NetManParticipant]

Hi Dimitar,

When can we expect a fix as this would be a heavily used control on our site?

Regards,
NetMan

[DimitarParticipant]

Hi NetMan,

This behaviour will be fixed in the next version of jQWidgets, ETA mid-August.

Best Regards,
Dimitar

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

[NetManParticipant]

Ok, new version has been released (v3.5.0) but this behavior was not addressed.

What happened?

Regards,
NetMan

[Peter StoevKeymaster]

Hello NetMan,

On browser resize, the DropDownList is closed. This is the behavior by design.

Best Regards,
Peter Stoev

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

[Author]

Posts