下拉列表中选定的值将重置为第一个项目

我试着浏览了很多关于dropdownlist的问题，但仍然没有解决我的问题。

我有一个Dropdownlist和一个Submit按钮。选择值后单击"提交"按钮时，应使用Dropdownlist的选定值更新标签文本。然而，每次从下拉列表中选择值时，都会刷新页面，并且捕获的值是下拉列表中的第一个项目。如何在所选值刷新之前正确捕获它？

我不知所措，不知道哪里出了问题。

*下拉列表中的所有项目都是唯一的。无重复。

我的代码：

ASP.NET

<form id="form1" runat="server">
        <asp:DropDownList ID="ddlCode" runat="server" AutoPostBack="true" OnSelectedIndexChanged="ddlCode_SelectedIndexChanged"/>
        <br />
        <asp:ScriptManager ID="ScriptManager1" runat="server" EnablePartialRendering="true"/>
        <asp:UpdateProgress ID="updProgress" AssociatedUpdatePanelID="UpdatePanel1" runat="server">
            <ProgressTemplate>
                <img alt="progress" src="img/loading.gif"/><br /><h2>Loading...</h2> 
            </ProgressTemplate>
        </asp:UpdateProgress>
        <br />
        <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional" >
            <ContentTemplate>
                <asp:Button ID="submitBtn" runat="server" cssclass="btn btn-success" OnClick="submitBtn_Click" Text="Submit"/>
                <asp:Label ID="lblCode" runat="server"/>
            </ContentTemplate>
            <Triggers>
                <asp:AsyncPostBackTrigger ControlID="ddlCode" EventName="SelectedIndexChanged"/>
            </Triggers>
        </asp:UpdatePanel>
    </form>

背后的代码

string ddlSelectedIndex = "";   
protected void Page_Load(object sender, EventArgs e)
{
   if (!IsPostBack)
   {
      //This is to load code into dropdownlist which works fine. 
      LoadCode();
   }
}
protected void ddlCode_SelectedIndexChanged(object sender, EventArgs e)
{ 
     ddlSelectedIndex =(ddlCode.Items[ddlCode.SelectedIndex].Text).Substring(0, 4);
}

protected void submitBtn_Click(object sender, EventArgs e)
{
     lblCode.Text = ddlSelectedIndex;
}