Datepicker for input elements created using for loop

Question

I want to add Jquery date picker to input elements created from for loop in PHP.

Say i use 'for' loop and generate 5 input elements:

 for($i=0;$i<=5;$i++)
 {
  echo '<input class="datepicker_input"/>';
 }

Now if i try attaching JQuery date picker

 $(window).load(function(){
    $(".datepicker_input").datepicker();
 });

This makes datepicker option to displayed to all elements generated, but when I select the second input and change date, the first input gets changed and the event is not binded to other input elements.

How can we make date picker option to be applicable to all input elements..

Other than the missing . in the class selector it is fine jsfiddle.net/arunpjohny/Ht74L/1 — Arun P Johny
– Arun P Johny, Commented Aug 6, 2014 at 5:23
Hi Arun, In fiddle it works fine as we create elements manually. But when we loop and create the elements it doesnot work. Please try to create elements in php using loop & check.. — user1796743
– user1796743, Commented Aug 6, 2014 at 6:27

user3912867 · Accepted Answer · 2014-08-06 05:26:42Z

1

firstly your selector

$("datepicker_input") is incorrect,
//it should be $(".datepicker_input").datepicker();

and then use and if you want to bind multiple items then go for jquery each. eg-

$('selector').each(function(){
$(this).datepicker();
});

answered Aug 6, 2014 at 5:26

user3912867

111 bronze badge

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

1 Comment

user1796743 Over a year ago

HI, accepted my mistake, it was a typo error. But still each function does not work in this case...

user1796743 · Accepted Answer · 2014-08-06 11:13:00Z

0

Thanks for the help extended... I got the solution. Only i needed to have id for the input element.

Solution:

To create elements dynamically:

  for($i=0;$i<=5;$i++)
  {
   echo '<input id="elementid'.$i.'" class="datepicker_input"/>';
  }

In JQuery:

 $(function() {
    $('.qwer').each(function(){
        $(this).datepicker();
    });
 });

It works now...

answered Aug 6, 2014 at 11:13

user1796743

391 silver badge10 bronze badges

Collectives™ on Stack Overflow

Datepicker for input elements created using for loop

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related