jquery listener input

Version imprimable

07/11/2013, 23h21
cquad

jquery listener input
Bonjour,

J'ai des inputs construits de 2 manières :
- 1 - Sans la classe DatePicker de jquery

Code:

<input type="text" name="input1" id="input1" >

- 2 - avec la classe DatePicker de jquery

Code:

<input type="text" name="input2" id="input2" class="datepicker">

Pour mes listeners :
Code:

1 2 3 4 5 6 7 $('#input1').change( function() { alert("ok input1"); }) $('#input2').change( function() { alert("ok input2"); })
En changeant les valeurs dans les 2 inputs, je n'ai que un message d'alerte sur input1, jamais sur le 2eme

Avez vous une explication?

Merci

Julien
08/11/2013, 08h33
SpaceFrog

la suel différence entre les deux étant la class datepicker, je ne peux que supposer que le script du datepicker applique un preventDefault sur le change de ton input2...
08/11/2013, 08h46
cquad

Merci pour ta réponse

Par contre, comment ajouter des actions supplémentaires sur cet évènement?
08/11/2013, 09h11
SpaceFrog

Comme le souci est que " à priori" c'est ton script de date picker qui bloque le onchange, il va falloir mettre les mains sous le capot du date picker pour y ajouter ton onchange ou voir si ton plugin a prévu des fonction callback ce qui est souvent le cas...
Mais sans savoir quel plugin tu utilises ...
08/11/2013, 09h14
cquad

aie !

j'utilise le Datepicker classique de jQuery UI : http://jqueryui.com/datepicker/

Si tu as une idée?

Je viens de trouver la solution avec ce bout de code

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<html lang="en">
<head>
  <meta charset="utf-8" />
  <title>jQuery UI Datepicker - Default functionality</title>
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
  <link rel="stylesheet" href="/resources/demos/style.css" />
  <script>
  $(function() {
    $( "#datepicker" ).datepicker();
  });
  </script>
</head>
<body>
 
<p>Date: <input type="text" id="datepicker" /></p>
 
 
</body>
</html>

Merci pour ton aide

08/11/2013, 09h24
SpaceFrog

je pense que la soluton se trouve plutot du coté de methodes du datepicker comme onSelect par exemple http://api.jqueryui.com/datepicker/#...hangeMonthYear