Question

I am using this timepicker which works great but the problem is I am adding the input fields on the fly and the time picker is not working on newly created input tags

I am using this jQuery

    $('.timepicker').timePicker({
      startTime: "02.00",  // Using string. Can take string or Date object.
      endTime: new Date(0, 0, 0, 15, 30, 0),  // Using Date object.
      show24Hours: false,
      separator:'.',
      step: 15
    });

I am having someone click a button and a new input field with the class time picker is getting appended to the page but the the jQuery time picker is not working…any ideas how to bind…

I tried this

    $('.timepicker').bind('click', function(){
        $('.timepicker').timePicker({
          startTime: "02.00",  // Using string. Can take string or Date object.
          endTime: new Date(0, 0, 0, 15, 30, 0),  // Using Date object.
          show24Hours: false,
          separator:'.',
          step: 15
        });
    });

But didn’t work

Answer 1

Use live –

$('.timepicker').live('click', function(){
    $(this).timePicker({
      startTime: "02.00",  // Using string. Can take string or Date object.
      endTime: new Date(0, 0, 0, 15, 30, 0),  // Using Date object.
      show24Hours: false,
      separator:'.',
      step: 15
    }).focus();
    $(this).removeClass('timepicker');
});

Demo – http://jsfiddle.net/Spfpj/4/