Datepicker positioning not correctly working

Question

I have a search box, that searches for a range of dates from a period which the user can select using the date picker plugin from jquery. The problem I am having is that the position of the date picker when enabled, is appearing at the bottom left hand corner of the page, instead of directly under the search box. I have provide the markup used for the jquery and the HTML part. Can anyone tell me how to correct this?

jQuery:

<script type="text/javascript" src="includes/javascript/daterangepicker.jQuery.js"></script>

<script type="text/javascript"> 
    $(function(){
        if($(window.parent.document).find('iframe').size()){
            var inframe = true;
        }

        $('.datepick').daterangepicker({
            arrows: false, 
            dateFormat: 'dd/mm/yy',
            posX: null,
            posY: null,
            onOpen:function(){ 
                if(inframe){
                    $(window.parent.document).find('iframe:eq(0)').width(700).height('35em');
                } 
            }, 
            onClose: function(){ 
                if(inframe){
                    $(window.parent.document).find('iframe:eq(0)').width('100%').height('5em');
                } 
            }
        }); 

    });
</script>

HTML:

<table border="0" align="right">
    <tr>
        <?php echo tep_draw_form('search_date_purchased', FILENAME_ORDERS, '', 'post'); ?>

        <td class="smallText" align="right">
            <?php echo TEXT_ORDER_DATE;?>
            &nbsp;
            <input type="text" name="search_date_purchased" placeholder="Choose a Date" class="datepick" value="<?php echo $HTTP_POST_VARS['search_date_purchased'];?>">
            &nbsp;
            <input src="./images/Search.png" alt="Search" title="Search" border="0" type="image">
        </td>
    </form>
    </tr>
</table>

Answer 1

Your html is not valid: You have a closing form tag in your html. Also you try to echo something inside a tr tag, that is not vallid html. you need to echo inside a td tag.

<table border="0" align="right">
     <tr>
       <td><?php echo tep_draw_form('search_date_purchased', FILENAME_ORDERS, '', 'post'); ?></td>
       <td class="smallText" align="right"><?php echo TEXT_ORDER_DATE;?>&nbsp;<input type="text" name="search_date_purchased" placeholder="Choose a Date" class="datepick" value="<?php echo $HTTP_POST_VARS['search_date_purchased'];?>">&nbsp;<input src="./images/Search.png" alt="Search" title="Search" border="0" type="image"></td>     
     </tr>
</table>