Intentando usar la validación en select2 con algunos problemas:

se mostrará el mensaje de error, pero no se eliminará cuando se ingrese una entrada válida.

Estoy cargando un valor inicial que funciona bien ... sin embargo, el validador no reconoce el valor y me dice que no es válido ... Tengo que escribir manualmente el mismo valor y luego lo valida, pero aún no lo elimina la clase / mensaje de error que lo muestra es válido.

forma:

<div class="col-md-12 margin-bottom-30 form-group">
    <div class="input-modal-group">
        <label for="vedit-filter" class="f-14"><b>filter :</b></label>
        <input id="vedit-filter" type="text" name="settings[filter]" class="form-control select2"/>
    </div>
</div>
<input id="filter_default" type="hidden" name="settings[original]" value="<?php echo escapeStr($result[filter]); ?>"/>

js:

// get the default filter           
var default_filter = $("#filter_default").val();

$("#vedit-filter").select2({
    //placeholder: "Select or enter...",
    allowClear: true,
    multiple: false,
    ajax: {
        dataType: 'json',
        url: '/process/get_filter_list.php',
        results: function (data) {
            return {results: data};
        }
    },
    createSearchChoice:function(term, data) {
        if ($(data).filter(function() {
            return this.text.localeCompare(term)===0; }).length===0) {
                return {id:term, text:term};
            }
        },
    initSelection : function (element, callback) {
        var obj= {id:default_filter, text:default_filter};
        callback(obj);
    }
});

$('#filters-edit').validate({
    errorElement: 'span', //default input error message container
    errorClass: 'help-block', // default input error message class
    focusInvalid: false, // do not focus the last invalid input
    rules: {
        'settings[filter]': {
            required: true
        }
    },

    messages: {
        'settings[filter]': {
            required: "Filter is required."
        }
    },

    highlight: function (element) { // hightlight error inputs
        $(element)
            .closest('.form-group').addClass('has-error');
    },

    unhighlight: function (element) { // un-hightlight error inputs
        $(element)
            .closest('.form-group').removeClass('has-error'); 
    },

    errorPlacement: function (error, element) {
        error.insertAfter(element.closest('.input-modal-group'));
    },

    // ajax submit
    submitHandler: function (form) {

    ...submit stuff below