Ways to combine jquery-ui Datepicker with inserting text on click.

Question

I have a table list with many input fields that has the jqueury datpicker in it. Every input field has as class datepicker and a random id number. when clicked in the input field teh datpicker pops up. With a click on he date the dtae gets inserted. So the he datepicker works fine. But now i want to add an image or text link next to the input field, and when i click on the image/text the content on the input field changes into the selected text. But untill now i cannot combine datepicker and this fucntion into one....

example i tried:

 <input type="text" id="a11" class="datepicker" name="sterilizationdate_1" value="<?php echo $sterilizationdate_1?>">
    <a href="#" class="CSA" onClick="addTextTag('To sterilization'); return false">CSA</a>

and the javascript

$('a.CSA').click(function(){
    $('.datepicker').val($('.datepicker').val()+$(this).html());
});

I tested this code without the datepicker and it just works fine... why cant i combine the two?

FOUND ANOTHER SOLUTION

custom text insert in datepicker

Answer 1

You are trying to get the val() of input tag but calling val on anchor tag

$('a.CSA').click(function(){
    $('.datepicker').val($('.datepicker').prev().val()+$(this).html());
});

Answer 2

Maybe you have another problem on how you call the Datepicker.

You can try:

$('a.CSA').on('click', function(){
    $('.datepicker').val($('.datepicker').prev().val()+$(this).html());
});

Instead of:

$('a.CSA').click(function(){
    $('.datepicker').val($('.datepicker').prev().val()+$(this).html());
});

Please this link .on()