Question

I’m using a pretty straightforward modal window for a webapp. For some reason whenever I click on any of the inputs in the modal, the focus is set to the input before it. However, if I click on the label, the focus is set to the proper input. Scratching my head on this one…

Here’s the markup:

<!--Admin Approve Modal -->
<div id="admin_approve_modal" class="modal hide fade" role="dialog" aria-labelledby="adminApproveModalLabel" aria-hidden="true">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
            <h3 id="adminApproveModalLabel">Approval For Order #<span class="js-orderID"></span></h3>
        </div>
        <form id="admin_approve_form" name="admin_approve_form" method="post" action="admin-form-submit.php?query=adminApprove">
            <div class="modal-body">
                <label for="poNumber" />Factory PO #:
                <input type="text" id="poNumber" name="poNumber" />
                <script>
                    $(function() {
                        $( "#etaDate" ).datepicker();
                    });
                </script>
                <label for="etaDate" />ETA Date:
                <input type="text" id="etaDate" name="etaDate" value="" />
                <label for="comments" />Comments:
                <input type="text" id="comments" name="comments" value="" />
                <div id="admin_validation_error" name="admin_validation_error"></div>
                <!--Hidden inputs-->
                <input type="hidden" id="adminOrderID" name="orderID" value="" />
            </div>
            <div class="modal-footer">
                <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
                <button type="submit" class="btn btn-primary">Approve</button>
            </div>
        </form>
    </div>
    <!-- end modal -->

There is no conflicting javascript (to my knowledge) on the page. Any ideas?

Answer 1

Well I’m dumb. For some reason I thought labels were self-closing… they aren’t!