Are you having trouble adding jquery elements

I have a problem with datePicker. When you create a new textbox with datepicker and add it to some div, it won't work. Someone had the same problem ...

$(function(){

    $("#DP").datepicker({showOn: 'button', buttonId: 'kalendar', buttonImage: 'calendar.gif', buttonImageOnly: true});

    $('a').click(function(){

         $('<input type="text" id="DP">').appendTo('#some_div').show();   
    });
});
...
...

<\body>
<\div id="some_div"></div>
<\a href="#">New datepicker<\/a>
...

      


I need to change the number of datePickers fields. And sorry for my english ..

+2


source to share


2 answers


I think this does what you want:

...

  <script type="text/javascript">
    $(document).ready(function(){
        field_count = 0;

        $("#add_datepicker").click(function(){
            field_count++;
            var new_field = jQuery("<input type=\"text\" />")
            new_field.attr("id","datepicker_"+field_count);
            new_field.attr("name","datepicker_"+field_count);
            $('#container').append(new_field);
            $('#container').append(jQuery("<br />"));
            $("#datepicker_"+field_count).datepicker();
        });
  });
  </script>
</head>
<body>

<form>
<input type="button" id="add_datepicker" value="Add Datepicker"/>
<div id="container">

</div>
</form>

...

      



This allows you to add another element <input>

with unique id

and unique name

so that it can be presented as form data.

+2


source


The problem is that you set "everything" (that is, one) #DP for the datepicker to document.ready, then you create a new input with id #DP. This will not be automatically set to datepicker, you either need to set the new entry as datepicker at "narrowing time", i.e.

$('a').click(function(){

     $('<input type="text" id="DP">').
         datepicker(/*...*/).appendTo('#some_div').show();   
});

      



NB! You can only have one DOM element with ID = DP

0


source







All Articles