DynamicModelMultipleChoiceField does not change from javascript

[Flocon29]

Using the form DynamicModelMultipleChoiceField is really interesting when filtering options from another field.
This works pretty well!

But when I want to change the form from Javascript, some changes are not visible on the page.

Example from the tags field in Interface edition page :

tags = DynamicModelMultipleChoiceField(
        queryset=Tag.objects.all(),
        required=False
    )

Javascript :

(function($) {
    $(function() {

        // Getting fields
        customField = $('#id_cf_interface_profile');
        tags = $('#id_tags');

        // Handle changes on customField
        customField.change(function() {
            selectionChange($(this));
        });
    });
})(django.jQuery);

And the SelectionChange function that I tried with many possibilities :
I want to select dynamically an option and set the field on readOnly.

function selectionChange(object) {
    tags[0].selectedIndex = 2;
    tags[0].disabled = true;
}

And I tried many other things like : tags[0].options[2].selected = true or tags[0].options.selectedIndex = 2 ...

If I change the tags form field to forms.ModelMultipleChoiceField, the above function works fine.

The option is correctly selected and the field is no more editable.
But this is not the display that I want.

Finally, for DynamicModelMultipleChoiceField the unique solution I found is to empty the field's options and generate new ones:

function selectionChange(object) {
        var value = tags[0].options[2].value;
        var text = tags[0].options[2].text;
        tags.empty();
        option = document.createElement("option");
        option.value = value;
        option.text = text;
        option.selected = true;
        tags[0].add(option, null);
}

But I did not find any solution for setting readOnly option on the field.

Does anyone have an idea to solve this? This solution is not really clean.
Thanks in advance.