Datepicker not working for html table rows except first row

It may be easier to solve if you can render your html and post it or post a link to your page making sure to take time to not include any private data. The issue is more than likely going to be a front end JS issue, that is why we need the rendered code or even better a link to your page.

Sometimes these things do not work because you are trying to listen for an id instead of a class name. If you are listening for a class name, there is probably a js error. You can also run the code on your server yourself, hit the f12 key to get to dev tools and check the console for errors.

please can you provide me some code snippet by using my code . it will be very helpful for me .

What you will need to do is render your code (run the page, copy and paste the html) in a format I can easily use it elsewhere to try it out. The best option is for you to take the time to set up a test page with fake data and provide a link.  The reason is this is a front end issue and not a back end. There is no way to easily see the issue unless the page is being viewed live or you can recreate it in something like code pen https://codepen.io/, jsfiddle https://jsfiddle.net/ or jsbin https://jsbin.com/.  

Once you have this working on the front end, you can figure out what you need to do on the back end to output what works.

I hope that makes better sense.  Your other option is to run the code on your own, hit the f12 key to see the developer tools and look at the console tab for errors.  Like I said, it is very possible you are rendering duplicate id's like

<div id="foo">Content one</div>
<div id="foo">Content two</div>

Select allOpen in new window

If you run the code through a validator like https://validator.w3.org/ you will see an error.  You can only have one unique id. This is a common error that can break your js code.

Hi Scott

Please take a dummy data as below -

https://jsfiddle.net/fevy61w8/1/

here i want each and every column date will come and when i select it replace the
old date of particular column.

one more thing here one add function is there which add the row
but in my scenario no add function when i call the page it will
take the data from database and create a grid.so please ignore
this add function .

From my last comment, I guessed right.  I said "it is very possible you are rendering duplicate id's like

<div id="foo">Content one</div>
<div id="foo">Content two</div>

Select allOpen in new window

This is what you have except it looks like

<input class="date1" id="dob" name="dob" type="text" value="" />
<input class="date2" id="dob" name="dob" type="text" value="" />
<input class="date3" id="dob" name="dob" type="text" value="" />

Select allOpen in new window

What you should have instead is

<input class="date" id="dob1" name="dob" type="text" value="" />
<input class="date" id="dob2" name="dob" type="text" value="" />
<input class="date" id="dob3" name="dob" type="text" value="" />

Select allOpen in new window

Then your datepicker is called only on the class one time
https://jsfiddle.net/mL7dj9n2/1/

<table  id="phone" width="100%" name="phone">
		    <tr>
			    <td colspan="5" bgcolor="#5C85B3">Phone</td>
			</tr>
			<tr>
				<th>Date1</td>
				<th>Date2</th>
				<th>Date3</th>
			</tr>
			<tr>
				<td>
		            <input class="date" id="dob1" name="dob" type="text" value="" />
				</td>
				<td>
		            <input class="date" id="dob2" name="dob" type="text" value="" />
				</td>
				<td>
		            <input class="date" id="dob3" name="dob" type="text" value="" />
				</td>
			</tr>
      
      </tr>
			<tr>
				<td>
		            <input class="date" id="dob4" name="dob" type="text" value="" />
				</td>
				<td>
		            <input class="date" id="dob5" name="dob" type="text" value="" />
				</td>
				<td>
		            <input class="date" id="dob6" name="dob" type="text" value="" />
				</td>
			</tr>
      
      </tr>
			<tr>
				<td>
		            <input class="date" id="dob7" name="dob" type="text" value="" />
				</td>
				<td>
		            <input class="date" id="dob8" name="dob" type="text" value="" />
				</td>
				<td>
		            <input class="date" id="dob9" name="dob" type="text" value="" />
				</td>
			</tr>
      
		</table>

$(document).ready(function(){
  
			    $(".date").datepicker();
         
			});

Select allOpen in new window

Hi Scott my requirement is something like attached image . if id is dynamically generated  then how can i take those values to servlet while submitting the  data . please refer the attached image.
Requirement.png

I was really just trying to help you get the date picker to work. The changes showed will do that.

If you are wanting to post data when the checkbox is ticked, treat that separately. You can do an onChange or onClick for the checkbox and inside of that function submit an ajax request.

can you please send me some code snippet to do above one it will be very helpful for me thanx in advance.recently i raised one question regarding this having subject "want to send dynamically created data to servlet while checkbox is cheeked" please tell me there it will be very helpful for me .

Thank You for your support.