how to focus on a button when using bootstrap in asp.net

Question

I try to use bootstrap modal box in asp.net, but I have a problem. this is my modal box :

<div class="modal fade" id="delete_project_modal" tabindex="-1" role="dialog" aria-hidden="true">
    <asp:UpdatePanel ID="upDelete" runat="server">
        <ContentTemplate>
            <asp:Panel ID="pnlProjectDelete" runat="server" DefaultButton="btnCancelDelete">
                <div class="smallBox clearfix modal-dialog" title="<%=Resources.Titles.DeleteProject %>">
                    <span class="smallBox_head_right"></span>
                    <h2 class="smallBox_head_left">
                        <asp:Label ID="Label1" runat="server" Text="<%$ Resources:Titles,DeleteProject %>" />
                    </h2>
                    <div class="smallBox_Content">
                        <div class="smallBox_Content2 clearfix">
                            <div class="form-group margin-bottom1 clearfix">
                                <div class="col-sm-12">
                                    <asp:Label ID="Label2" runat="server" Text="<%$ Resources:Messages,AreYouSureDelete %>" CssClass="error errorMassage" />
                                </div>
                                <div class="col-sm-12">
                                    <asp:Button ID="btnCancelDelete" data-dismiss="modal" runat="server" Text="<%$ Resources:Buttons,Cancel %>" CssClass="btn btn-default btn-left cancel-delete" OnClick="btnCancelDelete_Click" />
                                    <asp:Button ID="btnDelete" runat="server" Text="<%$ Resources:Buttons,Confirm %>" CssClass="btn btn-default btn-left" OnClick="btnDelete_Click" />
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </asp:Panel>
        </ContentTemplate>
    </asp:UpdatePanel>
</div>

I want when this box opened my asp panel default button work when I press enter key, but It doesn't work. How can I solve this problem? thank you

Answer 1

It is so easy than I think: just I add this script and my problem solved!

$(document).ready(function () {

        $('#delete_project_modal').on('shown.bs.modal', function (e) {

            $(this).find('.cancel-delete').focus();
        })
    });