How to put jqxDropDownButton on jqxToolBar

[ajcsParticipant]

I can see the example of how to use a jqxDropDownButton and the drop down content is inside the button’s selector div.

I don’t understand how to use a jqxDropDownButton on a jqxToolBar because there is no selector div. How do I set the content of the drop down?

Is there an example please?

[Peter StoevKeymaster]

Hi ajcs,

This example: https://www.jqwidgets.com/jquery-widgets-demo/demos/jqxtoolbar/javascript-toolbar-events.htm?light points out how to create custom components in the toolbar.

Hope it helps.

Regards,
Peter

[ajcsParticipant]

Thank you very much for your help so far but I have a problem to reference the control in the drop down. I can’t change anything on the control.

Here is part of my toolbar init code:

How do I set properties of ColChooser jqxListBox?

case 7:
tool.append(“<div style=’padding: 3px;’><div></div></div>”);
ColChooser = tool.children().children();
ColChooser.jqxListBox({
filterable: true,
filterPlaceHolder: “Search”,
searchMode: “containsignorecase”,
width: 200,
height: 200,
checkboxes: true
});

tool.jqxDropDownButton({
width: 100
});
tool.jqxDropDownButton(‘setContent’, “Columns”);

tool.on(‘open’, function () {
// This event does fire I can debug into here
// This does nothing
$(“#” + ColChooser[0].id).jqxListBox(‘source’, MyDataSource);
// This does nothing
$(“#” + ColChooser[0].id).jqxListBox(‘filterPlaceHolder’, “test”);
// This does nothing
ColChooser.filterPlaceHolder = “test2”;
// How do I set properties of ColChooser jqxListBox?
});

[ajcsParticipant]

I fixed it I changed:
ColChooser = tool.children().children();
to:
let ColChooser = tool.children().children();

I already had the following higher up in the code so I don’t know why it fixed it
let ColChooser;

Maybe some sort of a scope issue but it makes no sense because when I debugged it the id was there
$(“#” + ColChooser[0].id).jqxListBox(‘source’, MySource);

[Author]

Posts