Appeler datepicker dans une fonction externe

Bonjour,

J'ai un petit soucis avec mon code ci-dessous, le datepicker ne fonctionne pas s'il est appelé via la classe datepicker dans ma fonction jquery.
Il fonctionne pourtant parfaitement dans les champs input (classe="datepicker") si je mets le formulaire en dur en html.

D'ou vient le problème ?
Ligne 27 et ligne 31

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
 
<script type="text/javascript">
$(function() {
        var scntDiv = $('#experience');
        var i = $('#experience div').size() + 2;
 
        $('#addScnt').live('click', function() {
                $('<div class="section"><li id="_4'+i+'">'
 
					+ '<label class="description" for="entreprise">Experience ' + i +'</label>'
 
					+ '<div class="left">'
					+ '<input type="text" class="element text medium" id="entreprise[' + i +']" name="entreprise[' + i +']" value="" />'
					+ '<label>Nom de l\'entreprise</label></div>'
 
					+ '<div class="right">'
					+ '<input type="text" class="element text medium" id="fonction[' + i +']" name="fonction[' + i +']" value="" />'
					+ '<label>Fonction occupée</label>'
					+ '</div>'
 
					+ '<div>'
					+ '<input type="text" class="element text medium" id="secteur[' + i +']" name="secteur[' + i +']" value="" />'
					+ '<label>Secteur d\'activit&eacute;</label>'
					+ '</div>'
 
					+ '<div class="left">'
					+ '<input type="text" class="element text medium datepicker" id="date_debut[' + i +']" name="date_debut[' + i +']" value="" />'
					+ '<label>Date de debut</label></div>'
 
					+ '<div class="right">'
					+ '<input type="text" class="element text medium datepicker" id="date_fin[' + i +']" name="date_fin[' + i +']" value="" />'
					+ '<label>Date de fin</label>'
					+ '</div>'
 
					+ '<label class="description" for="description">Description</label>'
					+ '<div>'
					+ '<textarea id="description2" name="description2" placeholder="D&eacute;taillez vos missions, r&eacute;alisations, etc..." class="element textarea medium"></textarea>'
					+ '</div>'
 
					+ '<p><a href="#" id="removeDiv">Supprimer</a></p>'
					+'</li></div>')
 
				.appendTo(scntDiv);
                i++;
                return false;
        });
 
        $('#removeDiv').live('click', function() { 
                if( i > 1 ) {
                        $(this).parents('div:first').remove();
                        i--;
                }
                return false;
        });
});
</script>

Merci !

Bonsoir

La méthode live() est obsolète.

Nous en sommes à la version : "http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js".

$( "sélecteur parent non dynamique" ).on( "click", "sélecteur enfant dynamique ou non", function(){ ... });.

$( "body" ).on( "click", ".datepicker", function(){ ... });.

Pour ajouter un élément j'ai remplacer la fonction Live() par la fonction on() et ça fonctionne, par contre pour la fonction remove ça marche pas.

Ce code fonction :
Code:

1 2 3 4 5 6 7 $('#removeDiv').live('click', function() { if( i > 1 ) { $(this).parents('div:first').remove(); i--; } return false; });
Mais pas celui la :
Code:

1 2 3 4 5 6 7 $('#removeDiv').on('click', function() { if( i > 1 ) { $(this).parents('div:first').remove(); i--; } return false; });
Pourquoi ?

$( "body" ).on( "click", "#removeDiv", function(){ ... });..