How to add yii2 datepicker widget in external js file

Hi All,

I want to add a datepicker while I add a new row in gridview using js.

Here in my js file I have added a new row.




$('.add').on("click",function()

      {

        var new_row="<tr id='"+id+"'>";

        new_row += visit_label;

        new_row += "<td style='width:20px;'></td>";

        new_row += "<td style='width:20px;'></td>";

        new_row += "<td style='width:20px;'></td>";

        new_row += "<td style='width:20px;'></td>";

        new_row += "<td style='width:20px;'></td>";


        new_row += "<td style='width:40px;padding-top:10px;'>";

        new_row += datepicker;

        new_row += "<button id='calendar_button' class='btn' type='button'><i class='icon-calendar'></i></button>";

        new_row += " <button class='btn' id='clearDates'>X</button></br>";

        new_row += " </td>";


        new_row += "<td style='width:60px;'><textarea id='comm' rows='3' style='width:90%;'></textarea></td>";

        new_row += "</tr>";

        $(this).closest('tr').after(new_row);

      });



I want to use a datepicker widget there just like I have used in the gridview.


echo DatePicker::widget([

        'name' => 'datepicker', 

        'value' => date('Mon DD YYYY'),

        'options' => ['placeholder' => ''],

        'clientOptions' => [

          'dateFormat' => 'Mon DD YYYY',

          'todayHighlight' => true,

          'autoSize'=>true,

          'showOn'=> "button",

        ]

      ]);

Now how can I use datepicker in my external JS file?

Please help!

Thanks in advance.