CODEWITHSUNDEEP
javascriptjqueryonclickbootstrap-datepicker
user3000731
user3000731

Reputation: 93

Click event for date-picker icon

I want to open date-picker, when I click a calendar icon.

The calendar icon is inside of this template (in the i tag): 

     var iconTemplate = '<li id=\"{streamID}\" class=\"list\">{streamName} <i class="fa fa-calendar pull-right"></i></li>';

Can I add an onclick event inside of this html template or do I need to make a function?

The code to trigger the datepicker is:

('.datepicker').datepicker()

The problem is, I can't just say: 

iconTemplate.onclick=function(){ ('.datepicker').datepicker()};

because I only want the click event to be on the calendar icon, which is inside of iconTemplate.

**EDIT**

I tried the code below, but I'm thinking it didn't work because I don't actually reference the class 'fa-calandar' in the html--the only time it appears is in the js file, stored inside of the var iconTemplate. Do I need to reference a class from the html file in order to use the click function?

    $('.fa-calendar').click(function(){
      $(this).datepicker();
    });

Upvotes: 1

Views: 3899

Answers (1)

David Stetler
David Stetler

Reputation: 1451

change this:

('.datepicker').datepicker()

to this:

('.fa-calendar').datepicker()

You can add a click event like so:

$('.fa-calendar').click(function(){
  $(this).datepicker();
});

Upvotes: 2

Related Questions