Retaining Select2 SelectedValue after Postback inside Gridview inside UpdatePanel

If an asp:DropDownList has Select2 added to it the functionality is great when searching. I’ve added the functionality to add a new value to the list which works fine. (code below)

$(".CreateNewOption_INVOICESSUPPLIER").select2({
tags: true,
createTag: function (params) {
return {
id: params.term,
text: params.term,
newOption: true
}
},
templateResult: function (data) {
var $result = $("");

                        $result.text(data.text);

                        if (data.newOption) {
                            $result.append(" <em>(new)</em>");
                            $(document.getElementById('<%=hidValINVOICESSUPPLIER.ClientID%>')).attr("value", data.text);
                        }

                        return $result;
                        
                    },
                    placeholder: "",
                })

While the new option is added to the dropdownlist, if the dropdownlist is set to AutoPostback=true and has a script to run OnSelectedIndexChanged the dropdownlist resets and the value suddenly no longer exists. Other dropdownlists where new values have been added also reset and lose their new values. It has cost me days. Any pointers?

This is my Dropdownlist:

<asp:DropDownList ID=“ddlSUPPLIER_NAME” runat=“server” class=“CreateNewOption_INVOICESSUPPLIER” DataSourceID=“SQLSUPPLIER” SelectedValue=’<%# Bind(“SUPPLIER_NAME”)%>’ DataTextField=“SUPPLIER_NAME” DataValueField=“SUPPLIER_NAME” style=“clear:none;vertical-align:top;font-weight:900;font-size:16px;padding-left:10px !important;margin-left:0px !important;text-align:left !important;width:200px;” TabIndex=“5” AppendDataBoundItems=“true”>
<asp:ListItem Text="" Value="" />
</asp:DropDownList>

Did you find solution for this?