jQuery: how do I activate a datepicker from an element that is separate from the input field that the datepicker inserts the date into?
<p>This does not work the way I want to. currently, the text field activates the datepicker. but I want the click of the button to activate the datepicker:</p>

<pre><code>  &lt;script type="text/javascript"&gt;
        $j(function() {
            $j(".prop-expiry input").datepicker({
                showTrigger: '#exp-date-button'
            });
        });
    &lt;/script&gt;
</code></pre>

<p>This does, but I'd like to be able to use a hover image for the date select button (currently, it shows both the img, and the hover img... cause the png is a sprite.)</p>

<pre><code>&lt;script type="text/javascript"&gt; 
$(function() {
    $(".prop-expiry input").datepicker({
        showOn: 'button',
        buttonImage: '..images/btn_datepicker.png',
        buttonImageOnly: true
    });
});
&lt;/script&gt; 
</code></pre>

<p>And my field / button where I want the datepicker to show up:</p>

<pre><code>&lt;input class="input-field hasDatepicker" 
       id="object_expires_at" 
       name="object[expires_at]" 
       onclick="$j('.prop-expiry input').val(''); 
                $j('.prop-expiry input').css('color', 'black');" 
       size="30" type="text" 
       value="Enter or pick a date"&gt;
&lt;a id="exp-date-button" class="date-picker"&gt;Expiration Date&lt;/a&gt;
</code></pre>

<p>What I want: user clicks a#exp-date-button </p>

<p>and then the datepicker appears.</p>

<p>ideas?</p>
