0

I want to make 2 datapickers to work but they don't. I think that everything in my code is ok but I don't know why it's not working. There is part of my code:

<head>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />

<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.2/jquery-ui.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script>
  $(function() {
  $( "#datepicker" ).datepicker();
  });
</script>
</head>

<body>
<table>
<tr>
<td>Data1 :
    <input type="text" id="datepicker"></td>
<td>Data2 :
    <input type="text" id="datepicker"></td>
 </tr>
</table>
<button>Next</button>
</body>

Can You tell me what is wrong with this code?

KorWojci
  • 65
  • 1
  • 1
  • 6

3 Answers3

3

As mentioned in the comments, Multiple Id's are Invalid mark up.

To make this work change the Id to class

<table>
<tr>
<td>Data1 :
    <input type="text" class="datepicker"></td>
<td>Data2 :
    <input type="text" class="datepicker"></td>
 </tr>
</table>

and change the Jquery selector like this:

<script>
  $(function() {
      $( ".datepicker" ).datepicker();
  });
</script>
ssilas777
  • 9,672
  • 4
  • 45
  • 68
  • just a code snipped is not good way to answer the question. you can add some details what have you done to make it right? – Jai Dec 30 '14 at 09:03
  • @Jai I was not completed, but got submitted in between. Thanks for your time:) Much appreciated – ssilas777 Dec 30 '14 at 09:05
  • okay! but make sure to add details always, sometimes such answers get the downvotes too. – Jai Dec 30 '14 at 09:06
2

use class if you have multiple date field because id is unique to specific element. try this.

<input type="text" class="datepicker"></td>
<input type="text" class="datepicker"></td>

$( ".datepicker" ).datepicker();

SEE DEMO

0
<td>Data1 :
    <input type="text" id="datepicker"></td>
<td>Data2 :
    <input type="text" id="datepicker"></td>

This thing is wrong. You cannot use same ID again and again. If you want to use same thing more than one time use class as below.

<td>Data1 :
    <input type="text" class="datepicker"></td>
<td>Data2 :
    <input type="text" class="datepicker"></td>

<script>
  $(function() {
  $( ".datepicker" ).datepicker();
  });
</script>
Sameeraa4ever
  • 568
  • 7
  • 20