jQuery UI Datepicker only respond to the first textbox

Question

I'm trying to create a table with multiple rows and each row has a text box for user to input the date using the jQuery UI Datepicker. The problem is that the Datepicker is only updating the text box in the first row. Here is the datepicker function in the <head> :

<script>
$(function() {
    $('.dateinput').datepicker({ dateFormat: 'dd/mm/yy' }).val();
});
</script>

This is the text box:

<?php
while($fetch = mysql_fetch_array($query))
{
    echo "<td> <input type='text' id='dateinput' name='dateinput[]' value='" .date('d/m/Y'). "' class='dateinput' /> </td>";
}
?>

Any help would be very much appreciated. :)

Answer 1

You have problem due to Same Id which conflict You can use same class name

class='dateinput'

It work's

Answer 2

You are getting this problem as all rows have

id='dateinput'

You need to give them different id. Keep a counter variable and append it to id. Increase it in loop after appending.

Hope this helps.

jQuery UI Datepicker only respond to the first textbox

Question

2 answers

solution1
3 2013-12-12 11:05:42

solution2
2 ACCPTED 2013-12-12 04:35:14

jQuery UI Datepicker only respond to the first textbox

Question

2 answers

solution1 3 2013-12-12 11:05:42

solution2 2 ACCPTED 2013-12-12 04:35:14

solution1
3 2013-12-12 11:05:42

solution2
2 ACCPTED 2013-12-12 04:35:14