jQWidgets Forums

Tagged: dropdown close

This topic contains 7 replies, has 4 voices, and was last updated by Peter Stoev 9 years, 1 month ago.

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

Author

Dropdown button does not close on selecting any item from list. Posts
June 24, 2013 at 8:09 am Dropdown button does not close on selecting any item from list. #23659

Apeksha Singh
Participant

Hi,

I want to close the dropdownbutton list after user select any item.

Also I can’t re-select any item from the list.

Please guide me regarding these issues as soon as possible.

Thanks & Regrads,

Apeksha

June 24, 2013 at 8:32 am Dropdown button does not close on selecting any item from list. #23663

Mariya
Participant

Hi Apeksha,

Please provide us with an example.

Best Wishes,
Mariya

jQWidgets Team
http://www.jqwidgets.com

June 25, 2013 at 10:24 am Dropdown button does not close on selecting any item from list. #23824
Apeksha Singh
Participant
Hi Mariya,

This is a simple code for jqxdropdownbutton that I am using :-
```
// Create a approvedropDownButton
$("#approve_dropdown").jqxDropDownButton({ width: 120, height: 25, theme: 'ui-redmond' });
$('#approvejqxTree').bind('select', function (event) {
	var args = event.args;
	var item = $('#approvejqxTree').jqxTree('getItem', args.element);
	var dropDownContent = '<div style="position: relative; margin-left: 3px; margin-top: 5px;">' + item.label + '</div>';
	$("#approve_dropdown").jqxDropDownButton('setContent', dropDownContent);
});
$("#approvejqxTree").jqxTree({ width: 200,height: 85,  theme: 'ui-start'});
```
And the HTML part is :-
```
<div id="approve_dropdown" style="float:right;width:14%;margin-right:3%;">
   <div id='approvejqxTree'>
      <ul>
	   <li item-selected='true'>Approve</li>
	   <li>Approve & add another</li>
      </ul>
  </div>
</div>
```
Whenever I click on the button the dropdown gets open ,but after selecting any item from it I want the dropdown should close by itself.
Also if one item is selected I open the dropdown and I found it selected ,if I click on it again not able to fire any event again.

Please guide me as soon as possible.

Thanks & Regards,
Apeksha
June 25, 2013 at 10:41 am Dropdown button does not close on selecting any item from list. #23830

Mariya
Participant

Hi Apeksha Singh,

The jqxDropDownButton is not closing by itself when you click its content so in order to close it you should use the ‘close’ method. It depends on you how to use the method. You can call it when the jqxDropDownButton is clicked (as shown in our Demo) or when the content is clicked.
When you select the selected item for the second time it is normal not to be able to fire the same event because is has already been fired and nothing would change.

Best Wishes,
Mariya

jQWidgets Team
http://www.jqwidgets.com

June 25, 2013 at 11:17 am Dropdown button does not close on selecting any item from list. #23833

Apeksha Singh
Participant

Hi Mariya,

But my requirement is to fire the same event again as I have two options “Approve” and “Approve & add another”. For second one I want to fire the same event any number of time ,then what should I do.

And also please provide me the code that close the dropdown when the content is clicked.

Thanks & Regards,
Apeksha

June 26, 2013 at 9:21 am Dropdown button does not close on selecting any item from list. #23876
Mariya
Participant
Hi Apeksha Singh,

You may get the clicked Item’s Text by using the following code:
```
$("#jqxTree .jqx-item").mousedown(function (event) {
                var text = $(event.target).text();
            });
```
Best Wishes,
Mariya

jQWidgets Team
http://www.jqwidgets.com
February 3, 2016 at 4:10 pm Dropdown button does not close on selecting any item from list. #81084
arkgroup
Participant
I have similar problem. I want close dropdown when the content is clicked. I have this code, but close method does not close drop down:
```
    
$("#jqxgrid_details").on('rowselect', function (event) {
 var args = event.args;
 var row = $("#jqxgrid_details").jqxGrid('getrowdata', args.rowindex);
 var dropDownContent = '<div style="position: relative; margin-left: 3px; margin-top: 5px;">' + row['Name'] + ' ' + row['Login_Id'] + '</div>';
 $("#jqxdropdownbutton_details").jqxDropDownButton('setContent', dropDownContent);
 
 $("#jqxdropdownbutton_details").jqxDropDownButton('close');

 });
```
February 3, 2016 at 5:52 pm Dropdown button does not close on selecting any item from list. #81087

Peter Stoev
Keymaster

Hi arkgroup,

I suggest you to check your code for syntax or other errors. When “close” is called, the DropDownButton will be closed in any case. However, if you have syntax errors somewhere, the “close” may never be called in your code. See: http://jsfiddle.net/akav3buh/, where “close” is called dynamically when an item is clicked. The sample uses jQWidgets 4.0.0.

Best Regards,
Peter Stoev

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

Posts

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

You must be logged in to reply to this topic.