Jquery: make show / hide date picker using image?

Question

I want to use a calendar image to show / hide jquery datepicker. Based on the documentation, it seems like I need to set the buttonImage and buttonImageOnly that I have. date picker works, but it is always visible. here is my code:

<script type="text/javascript">
$(document).ready(function(){
$("#datepicker").datepicker({ 
    altField: '#from', 
    altFormat: 'yymmdd', 
    buttonImage: 'datepicker.png', 
    buttonImageOnly: true, 
    defaultDate: <?=getDaysFromToday($_GET['from'])?>, 
    showOn: 'focus' 
    });
});

$('#datepicker').datepicker({
    onSelect: function(dateText, inst) {
    $("#myform").submit(); 
    }
});
 </script>

Also, I'm trying to get it to submit the form, when you select a date, I cannot get it to work.

Am I doing something wrong?

Thanks!

Answer 1

Replace

showOn: 'focus'

from

showOn: 'button'

This will display the date when the button is pressed, and not when the text field receives focus.

, . - , false?

this , , submit:

this.form.submit();

. , .

, datepicker. :

$("#datepicker").datepicker({ 
    altField: '#from', 
    altFormat: 'yymmdd', 
    buttonImage: 'datepicker.png', 
    buttonImageOnly: true, 
    defaultDate: <?=getDaysFromToday($_GET['from'])?>, 
    showOn: 'focus'.
    onSelect: function(dateText, inst) {
        $("#myform").submit(); 
    }
});

Answer 2

, :

http://forum.jquery.com/topic/altering-position-of-datepicker-icon#14737000001522067

.ui-datepicker-trigger {
margin-left : 5px;
vertical-align : top;
}