Datepicker出现在页面的末尾

Question

出于某种原因，我的日期选择器出现在页面底部而不是我的文本框旁边。 css（ - 可以发布，如果请求）没有从默认更改，我尝试搞乱Inspect元素，但我没有成功。任何人都可以指导我这个bug的来源吗？

文本框：

        <tr>
            <th>Date</th><td>@Html.EditorFor(model => model.DateOfAppointment)</td>
            <th>Time</th><td>@Html.EditorFor(model => model.TimeOfAppointment)</td>
        </tr>

页面结束：

@section Scripts {
@Scripts.Render("~/bundles/jqueryval")
<script type="text/javascript">
    $(document).ready(function () {
        $("#DateOfAppointment").datepicker({
            format: 'dd/mm/yyyy'
        });

        $('#datepicker').on('changeDate', function (ev) {
            $(this).datepicker('hide');
        });
    });
</script>
}