Select2正在我的组件中重复

Question

我在我的页面中使用jquery插件，直到现在我对它没有任何问题。当我使用带有ascx页面的select2时，问题就发生了。以下问题的更多描述。

我有一个aspx，我使用组件ascx来显示某些东西：

protected void btnUF_Click(object sender, EventArgs e)
    {
        dlgUF.Visible = true;
    }

在我的代码背后：

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="DialogUF.ascx.cs"
    Inherits="Organization.DialogUF" %>

...
<asp:Panel ID="pnlBody" runat="server">
<fieldset class="grid-form">
    <div data-row-span="12">
        <div data-field-span="6">
            <asp:Label runat="server" AssociatedControlID="ddlState">UF 
            <span class="text-danger">(*)</span>:</asp:Label>
            <asp:DropDownList ID="ddlState" runat="server"
                CssClass="form-control" 
                OnSelectedIndexChanged="ddState_SelectedIndexChanged"
                AutoPostBack="True">
            </asp:DropDownList>
        </div>
    </div>
</fieldset>
...
<script type="text/javascript">
        $(document).ready(function () {
            $("#<%= ddlState.ClientID %>").select2();
           });
</script>
</asp:Panel>

Mas ascx：

var myObj1 = {};
myObj1["cz"] = "Czech";
myObj1["en"] = "English";
myObj1["de"] = "German";

for (var key in myObj1.foo) {
    console(key + " is the abbreviation for " + myObj1[key]);
}

Image of select2 duplicated