Star

New options

The jSuites.dropdown and autocomplete plugin allows the user to add new options to the dropdown. This feature is disabled by default. The initialization flag newOptions: true will enabled the feature. There is an extra option to handle ids generate in a remote server, as follow:

<html>
<script src="https://jsuites.net/v4/jsuites.js"></script>
<link rel="stylesheet" href="https://jsuites.net/v4/jsuites.css" type="text/css" />

<div id="dropdown"></div>

<script>
jSuites.dropdown(document.getElementById('dropdown'), {
    data:[
        { value:'1', text: 'Tomatoes' },
        { value:'2', text: 'Carrots' },
        { value:'3', text: 'Onions' },
        { value:'4', text: 'Garlic' },
    ],
    newOptions: true,
    oninsert: function(o, item, dataItem) {
        jSuites.ajax({
            url: '/v4/getId',
            type: 'POST',
            dataType: 'json',
            data: { data: item },
            success: function(result) {
                // Set the item id from the number sent by the remote server
                item.value = result;
                // Set the new value for the data
                data.value = result;
            }
        });
    },
    width:'280px',
});
</script>
</html>