jQuery UI Datepicker only respond to the first textbox

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. :)

Answers:

Answer

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.

Answer

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

class='dateinput'

It work's

Tags

Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us Javascript

©2020 All rights reserved.