How to get jquery ui date picker working with angular2?

Question

I'm using angular2 and typescript with html5.

I'm trying to add the jquery ui datepicker.

I have all the librarys and the css added but the datepicker jquery code is wiring up to the html.

Heres my code:

  <script>
  $(function() {
    $( "#datepicker" ).datepicker();
  });
  </script>

  <p>Date: <input type="text" id="datepicker"></p>

I've tried putting this in my component : $( "#datepicker" ).datepicker(); But I just get errors.

any ideas?

I get this error when I add the project to mine:

I just couldnt get the datepicker work in an angular 2 environment — AngularM
– AngularM, Commented Jan 29, 2016 at 16:57
PrimeNG will provide a datepicker very soon according to their roadmap. blog.primefaces.org/?p=3763 — Cagatay Civici
– Cagatay Civici, Commented Feb 1, 2016 at 10:18

Pardeep Jain · Accepted Answer · 2016-02-03 17:41:11Z

1

Well there are already many datepicker libraries available for the angular2. few of them i have posted below:

but yes obviously everyone need stylish datepicker for our project me too want same so i according to need i have created one datepicker using bootflat framework for styling. you can refer here..

https://github.com/MrPardeep/Angular2-DatePicker

hope this may help you !

edited Feb 3, 2016 at 17:41

answered Jan 29, 2016 at 17:05

Pardeep Jain

86.9k38 gold badges172 silver badges220 bronze badges

Sign up to request clarification or add additional context in comments.

9 Comments

Pardeep Jain Over a year ago

sorry but this referred repo is working fine for me...btw whats the error you have ?

AngularM Over a year ago

Which one of the three links above did you try?

AngularM Over a year ago

does it work in internet explorer? because the documentation says chrome and firefox

Pardeep Jain Over a year ago

i have't tested on IE you can test. i am not sure about this

AngularM Over a year ago

is there a demo link? so i can try it first in ie?

|

Cagatay Civici · Accepted Answer · 2016-02-03 16:23:06Z

1

PrimeNG also provides a component for DatePicker. Live demo;

http://www.primefaces.org/primeng/#/calendar

answered Feb 3, 2016 at 16:23

Cagatay Civici

6,5141 gold badge31 silver badges35 bronze badges

Comments

Community · Accepted Answer · 2020-06-20 09:12:55Z

1

See this question as a answer of how to use jQuery UI plugins in your app Whats the best way to use jquery widgets inside angular 2?

This example uses ElementRef but you could also use ViewChild

:-)

edited Jun 20, 2020 at 9:12

CommunityBot

11 silver badge

answered Dec 8, 2016 at 14:31

Luke T O'Brien

2,8755 gold badges32 silver badges45 bronze badges

Comments

vlio20 · Accepted Answer · 2016-11-05 11:42:44Z

0

Here is another one with many configurations, live demo:
https://vlio20.github.io/ng2-date-picker/

answered Nov 5, 2016 at 11:42

vlio20

9,33518 gold badges104 silver badges188 bronze badges

Collectives™ on Stack Overflow

How to get jquery ui date picker working with angular2?

4 Answers 4

9 Comments

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

9 Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related