DropDownButton in window

[luciferwzlParticipant]

We are payed user.

Problem:
First: Create a DropDownButton in the Window.
Second: Open the DropDownButton’s Popup.
Third: DropDownButton’s popup haven’t close when click any item in the window. And the DropDownButton’s Popup remains open when window is closed.

I have check your code, and fixed the bug, please the problem bind to next release version.

modify file: jqxdropdownbutton.js
method: closeOpenedDropDown
code line: 799
old code: if (this.className.indexOf && this.className.indexOf(‘jqx-popup’) != -1)
new code: if (this.className.indexOf && this.className.indexOf(‘jqx-window’) === -1 && this.className.indexOf(‘jqx-popup’) != -1)

[ivailoParticipant]

Hi luciferwzl,

Please try this demo. Here is not occurred such a behavior.

Best Regards,
Ivailo Ivanov

jQWidgets Team
http://www.jqwidgets.com

[luciferwzlParticipant]

Hi ivailo,

Please try this code, this is a jqxdropdownbutton in the window.

Open popup after click any element in the window or click close.

html party

<div id='jqxwindow'>
  <div>Header</div>
  <div>
    <input id="jqxInput" />
    <div id="jqxdropdownbutton">
      <div style="border-color: transparent;" id="jqxgrid">
      </div>
    </div>
  </div>
</div>
<button id="button">Open</button>

script party

$("#jqxInput").jqxInput({
  width: 150,
  height: 25
});
$("#jqxgrid").jqxGrid({
  height: 300,
  width: 300,
  columns: [{
    text: 'First Name',
    columntype: 'textbox',
    datafield: 'firstname',
    width: 90
  }, {
    text: 'Last Name',
    datafield: 'lastname',
    columntype: 'textbox',
    width: 90
  }, ]
});
$("#jqxdropdownbutton").jqxDropDownButton({
  width: 150,
  height: 25
});
$("#jqxwindow").jqxWindow({
  isModal: true,
  height: 500,
  width: 500,
  theme: 'energyblue',
  autoOpen: false
});
$("#button").click(function() {
  $("#jqxwindow").jqxWindow('open');
});

Best Regards,
luciferwzl

[ivailoParticipant]

Hi luciferwzl,

Thanks. We will consider this behavior.
To avoid it, please, bind to the close event of the window and close the button.

$(‘#jqxwindow’).on(‘close’, function (event) {
$(‘#jqxdropdownbutton’).jqxDropDownButton(‘close’);
});

Here is a demo.

Best Regards,
Ivailo Ivanov
jQWidgets Team
http://www.jqwidgets.com

[Author]

Posts