Issue with ASP dropdown control inside of Lightbox modal

[tazscotttalib]

My page includes an ASP dropdown control inside of a WET Lightbox control. The user selects a role from the dropdown and clicks a continue button, from which the selected role is used to determine permissions. However, the button event indicates that the selected option is always the first item (likely because the Lightbox modal is rendered outside of the form). This issue was resolved by adding a "form=" attribute in the markup tag for browsers supporting HTML5, but the issue persists in IE11.

Markup:

<form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server" ScriptMode="Release" EnableScriptGlobalization="True"></asp:ScriptManager>
    <asp:UpdatePanel ID="upnlModal" runat="server">
        <Triggers>
            <asp:AsyncPostBackTrigger ControlID="btnContinueRoleSelect" EventName="Click" />
            <asp:AsyncPostBackTrigger ControlID="ddlRoleSelection" EventName="SelectedIndexChanged" />
        </Triggers>
        <ContentTemplate>
            <asp:Button runat="server" ID="btnEnglish" Text="" style="display:none;" OnClick="btnEnglish_Click" />
            <asp:Button runat="server" ID="btnFrench" Text="" style="display:none;" OnClick="btnFrench_Click" />
            <section id="mdlRoleSelection" class="mfp-hide modal-dialog modal-content overlay-def" aria-labelledby="lblRoleSelectionTitle" aria-hidden="true">
	            <header class="modal-header">
		            <h2 class="modal-title"><asp:Label ID="lblRoleSelectionTitle" runat="server" Text=""></asp:Label></h2>
	            </header>
	            <div class="modal-body">
		            <p><asp:Label runat="server" ID="lblModalDescription"></asp:Label></p>
                    <asp:DropDownList ID="ddlRoleSelection" runat="server" form="form1" CssClass="form-control">
                    </asp:DropDownList>
	            </div>
                <div class="modal-footer">
                    <asp:Button ID="btnContinueRoleSelect" runat="server" form="form1" Text="" CssClass="btn btn-primary btn-sm" OnClick="btnContinueRoleSelect_Click" UseSubmitBehavior="false" data-dismiss="modal" />
                    <asp:Button ID="btnCancelRoleSelect" runat="server" Text="" CssClass="btn btn-default btn-sm popup-modal-dismiss" />
                </div>
            </section>
        </ContentTemplate>
    </asp:UpdatePanel>
</form>

Code Behind:

protected void btnContinueRoleSelect_Click(object sender, EventArgs e)
        {
            GetUserProfile(ddlRoleSelection.SelectedValue);
        }

(SelectedValue is always the first value in the dropdown)

Is there a way to fix this for IE11 or will I have to switch to another method (most likely JS/Ajax)