Javascript function stops after first while loop in PHP

Question

I have some javascript that creates a datetime picker on each row of a table. The function only works on the first row. I understand that the reason for this is that the datepicker shares the same ID on every row. How can I adjust my code to fix this?

<script type="text/javascript">
$(document).ready(function (){
$('#duedate').datetimepicker({
controlType: 'select',
timeFormat: 'hh:mm tt'
});
});
</script>

<?php $txtJob = $_GET['pickjob']; ?>

<?php
$query2 = "Select Work_Center, Sequence, Est_Total_Hrs from V_schedule WHERE job  = '" . $txtJob . "'";
$results2 = sqlsrv_query($connPpp, $query2);?>

<form id="frmpromiseddate" name="frmpromiseddate" action="schedule_job_submit.php" method="POST">
       <table  class='table table-bordered table-condensed table-striped'>
           <tr>
               <td>Sequence</td>
               <td>Work Center</td>
               <td>Due Date</td>
           </tr>
<?php while ($row2 = sqlsrv_fetch_array($results2)) {?>
         <tr>
            <td><?php echo $row2['Sequence']?></td>
            <td><?php echo $row2['Work_Center']?></td>
            <td><input type="text" name="duedate" id="duedate" value="" />    </td>
         </tr>
<?php ;} //End of while ?>
</table>

Change id (#) to class (.).

u_mulder
– u_mulder

2016-03-11 20:48:28 +00:00
Commented Mar 11, 2016 at 20:48 — u_mulder
– u_mulder, Commented Mar 11, 2016 at 20:48

Death-is-the-real-truth · Accepted Answer · 2016-03-11 21:04:03Z

2

Jquery treats idas unique identifier and apply on only one element at a time, where as it treats class as a group-identifier and can apply to multiple element at a time so change id to class both in html and Jquery code:-

<td><input type="text" name="duedate" class="duedate" value="" /></td>

And

$('.duedate').datetimepicker({

edited Mar 11, 2016 at 21:04

answered Mar 11, 2016 at 20:54

Death-is-the-real-truth

72.3k10 gold badges59 silver badges105 bronze badges

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

1 Comment

RGF Drone Over a year ago

Thanks. That was perfect

Ravinder Reddy · Accepted Answer · 2016-03-11 20:55:39Z

1

Use class(.) instead of id(#) for date picker

Javascript code :

$('.duedate').datetimepicker()

HTML code: making id unique

<?php $i=0;
while ($row2 = sqlsrv_fetch_array($results2)) {?>
     <tr>
        <td><?php echo $row2['Sequence']?></td>
        <td><?php echo $row2['Work_Center']?></td>
        <td><input type="text" name="duedate" class="duedate" id="duedate_<?php echo $i;?>" value="" />    </td>
     </tr>
<?php $i++; } //End of while ?>

answered Mar 11, 2016 at 20:55

Ravinder Reddy

3,8791 gold badge16 silver badges24 bronze badges

1 Comment

sm1215 Over a year ago

it's not and keeping the ID around can be useful - for example if OP decided he wanted to add labels to his markup

Collectives™ on Stack Overflow

Javascript function stops after first while loop in PHP

2 Answers 2

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related