jQWidgets Forums

Tagged: #combobox, add, addItem, item, jqxComboBox, search

This topic contains 3 replies, has 3 voices, and was last updated by Dimitar 7 years, 8 months ago.

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

Author

Is possible adding element when writing search box. Posts

January 17, 2014 at 7:05 am Is possible adding element when writing search box. #47987

Participant

I would like to use search box for add element to Combobox. Such as :

` var source = [
“Affogato”,
“Americano”,
“Bicerin”,
“Breve”,
“Café Bombón”,
“Café au lait”,
“Caffé Corretto”,
“Café Crema”,
“Caffé Latte”];
$(“#jqxComboBox”).jqxComboBox({
source: source,
theme: ‘energyblue’,
width: ‘200px’,
height: ’25px’,
selectedIndex: 0,
search: function (searchString) {

$(“#jqxComboBox”).jqxComboBox(‘addItem’, searchString);

}
});`

But it does not work. How can I do this?

Thanks in advance.

January 17, 2014 at 7:43 am Is possible adding element when writing search box. #47990

Dimitar

Participant

Hello ziyahan,

This scenario is not supported by jqxComboBox. However, you may try the same, but with remoteAutoComplete set to true (the search callback function is called only in this case):

<!DOCTYPE html>
<html lang="en">
<head>
    <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" />
    <script type="text/javascript" src="../../scripts/jquery-1.10.2.min.js"></script>
    <script type="text/javascript" src="../../scripts/demos.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>
</head>
<body>
    <div id='content'>
        <script type="text/javascript">
            $(document).ready(function () {
                var source = [
                    "Affogato",
                    "Americano",
                    "Bicerin",
                    "Breve",
                    "Café Bombón",
                    "Café au lait",
                    "Caffé Corretto",
                    "Café Crema",
                    "Caffé Latte"
                ];
                $("#jqxComboBox").jqxComboBox({
                    source: source,
                    width: '200px',
                    height: '25px',
                    selectedIndex: 0,
                    remoteAutoComplete: true,
                    search: function (searchString) {
                        $("#jqxComboBox").jqxComboBox('addItem', searchString);
                    }
                });
            });
        </script>
        <div id='jqxComboBox'>
        </div>
    </div>
</body>
</html>

Best Regards,
Dimitar

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

August 23, 2017 at 5:23 pm Is possible adding element when writing search box. #95613

Peter__Pan

Participant

Is this scenario supported by jqxComboBox now i n version > 5?
I have json datasource and want to add items (when user input strings in select) if they are not in my default datasource.

This scenario unfortunately does not work for me(

var source =
                {
                    datatype: "json",
                    datafields: [
                        { name: 'tag' }
                    ],
                    url: MYURL,
                    async: false
                };
                var tagsDataAdapter = new $.jqx.dataAdapter(source);
            $("#jqxTagsCombobox").jqxComboBox({ theme:'ofice', remoteAutoComplete: true,
            source: tagsDataAdapter, multiSelect: true, displayMember: "tag", valueMember: "tag", width: 200, height: 25,
            search: function (searchString) {
                        $("#jqxTagsCombobox").jqxComboBox('addItem', searchString);}
    });

August 24, 2017 at 5:16 am Is possible adding element when writing search box. #95622

Dimitar

Participant

Hello Peter__Pan,

Please refer to the following solution: http://jsfiddle.net/Dimitar_jQWidgets/1jgb1yju/. In the example, if an item that is not from the source is entered and the Enter key is pressed, the entered value will be added as a new item of the combobox and selected. In your case, instead of source.indexOf(value) === -1, you should check against the records in tagsDataAdapter. We hope this solution is helpful to you.

Best Regards,
Dimitar

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

Author

Posts

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

You must be logged in to reply to this topic.