jQWidgets Forums

Tagged: combobox, jqxComboBox, jqxListBox, ListBox

This topic contains 2 replies, has 2 voices, and was last updated by Narendra 12 years ago.

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

Author

remove item in jqxListbox basing on checked items of another combobox Posts

March 12, 2013 at 12:56 pm remove item in jqxListbox basing on checked items of another combobox #16800

Narendra

Participant

Hi Frnds,

I am using One jqxCombobox with checkboxes and one list box,

When I checking items of the combo box then the checked items will be added to list box dynamically at the same time. But here my problem is that when i unchecking the items in combobox then the unchecked items will be removed dynamically at the same time. So please Provide me jquery code for removing unchecked items from listbox dynamically

Thanks in advance..

March 12, 2013 at 1:51 pm remove item in jqxListbox basing on checked items of another combobox #16807

Dimitar

Participant

Hello narendra.pvnb,

To achieve the required behaviour, you should apply the following workaround:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" />
    <script type="text/javascript" src="../../scripts/jquery-1.9.1.min.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxbuttons.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxscrollbar.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxlistbox.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxcombobox.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxcheckbox.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $("#jqxlistbox").jqxListBox({ width: '200px', height: '200px' });
            var source = [
                    "Affogato",
                    "Americano",
                    "Bicerin",
                    "Breve",
                    "Café Bombón",
                    "Café au lait",
                    "Caffé Corretto",
                    "Café Crema",
                    "Caffé Latte",
		        ];
            $("#jqxcombobox").jqxComboBox({ source: source, selectedIndex: 0, width: '200px', height: '25px', checkboxes: true });
            $("#jqxcombobox").on('checkChange', function (event) {
                if (event.args) {
                    var item = event.args.item;
                    var value = item.value;
                    var label = item.label;
                    var checked = item.checked;
                    if (checked == true) {
                        $("#jqxlistbox").jqxListBox("addItem", label);
                    } else {
                        var items = $("#jqxlistbox").jqxListBox('getItems')
                        for (var i = 0; i < items.length; i++) {
                            if (items[i].value == label) {
                                break;
                            };
                        };
                        $("#jqxlistbox").jqxListBox('removeAt', i);
                    };
                };
            });
        });
    </script>
</head>
<body>
    <div id='jqxcombobox' style="float: left;">
    </div>
    <div id='jqxlistbox' style="float: left;">
    </div>
</body>
</html>

Best Regards,
Dimitar

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

March 12, 2013 at 1:59 pm remove item in jqxListbox basing on checked items of another combobox #16811

Narendra

Participant

Hi Sir, Thanks for your reply…….

It’s working Thanks alot to you…….

Author

Posts

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

You must be logged in to reply to this topic.