CODEWITHSUNDEEP
javascriptajaxselectize.js
Ugurtan Pektas
Ugurtan Pektas

Reputation: 31

How can i change item value in onItemAdd event ? - Selectize.js

I'm using selectize.js for tags. I want to add new tag dynamicly on my select. When i add new item to my db with ajax request in onItemAdd event, this option has no right value. How can i change value of item when ajax is done ?

My code : 

$('.campaign-tag-selectize').selectize({
            plugins         : ['remove_button', 'restore_on_backspace'],
            create          : true,
            onItemAdd : function (value, $item) {
                if(!Number.isInteger(value)){
                    $.post('/ajaxrequesturl', {'title':value, "_token": $('input[name="_token"]').val()}, function (returnVal) {
                        // I try to change value with change attr but not working :)
                        $item.attr('data-value', returnVal.id);
                        console.log(returnVal);
                    });
                }
            }
        });

Upvotes: 1

Views: 219

Answers (1)

Ayad Kara Kâhya
Ayad Kara Kâhya

Reputation: 128

use onOptionAdd instead !

// Apply Selectize to the your dropdown
$('.campaign-tag-selectize').selectize({
    plugins  : ['remove_button', 'restore_on_backspace'],
    create   : true,
    onOptionAdd: function (value, data) {
        var selectize = this;
        // Added itmes gets same value as text
        if (data.value === value) {
            // If the newly added option's value is not what you want, modify it.
            if(!Number.isInteger(data.value)) {
                selectize.removeOption(value); // Remove the newly added option
                selectize.addOption({ value: '0', text: data.text }); // Re Add it with wanted value '0' in this case
                selectize.setValue('0'); // Set the new value 
            }
        }
    }
});

Upvotes: 0

Related Questions