Discussion :

[jimmo]

Bonsoir,

Dans mon formulaire, j'ai un champ date.

J'aimerais que, lorsqu'une date sélectionnée est supérieure à la date du jour, les autres champs se grisent.

Je ne m'y connais pas en JS, donc si quelqu'un peut me mettre sur la voie.

Merci

[vermine]

Bonjour,

Regardez ici pour désactiver les champs : http://javascript.developpez.com/faq...Objs#TextCheck

Et ici pour comparer les dates : http://javascript.developpez.com/faq...dates.comparer

[jimmo]

Merci pour les liens.
je suis en train de faire une soupe avec ces codes... je ne m'y connais pas en JS, tu aurais un peu plus de temps pour m'expliquer stp?

[jimmo]

J'ai trouvé un bout de code que j'ai modifié et qui me convient presque parfaitement

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
$(document).ready(function() {
var now = new Date();
var annee   = now.getFullYear();
var mois    = now.getMonth() + 1;
var jour    = now.getDate();
 
    $('input[name="date_chq"]').keyup(function() {
    var $f = $('input[name="num_chq"]');
        ($(this).val() > ""+jour+"/"+mois+"/"+annee+"") ? $f.attr('disabled', true) : $f.attr('disabled', false);
    var $f = $('input[name="encaisse_chq"]');
        ($(this).val() > ""+jour+"/"+mois+"/"+annee+"") ? $f.attr('disabled', true) : $f.attr('disabled', false);
 
<input type="text" name="date_chq" /><br />
<input type="text" name="num_chq" /><br />
<input type="text" name="encaisse_chq" />

Comme ceci, ça fonctionne. Les input se grisent en fonction de la date.

Mon soucis est que j'utilise datepicker. Et la ça ne fonctionne plus. De la même maniere si je remplace "text" par "date" ça ne fonctionne pas mieux.

Quelqu'un a une idée?

[vermine]

Qu'entendez-vous par "Mon soucis est que j'utilise datepicker." ?

[danielhagnoul]

Mon soucis est que j'utilise datepicker. Et la ça ne fonctionne plus. De la même maniere si je remplace "text" par "date" ça ne fonctionne pas mieux. Quelqu'un a une idée?

Il faut transformer le texte de l'input Datepicker en objet Date en fonction de la structure du texte. La structure du texte est donnée par le format imposé au Datepicker.

Pour :

Code JS :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
    $.datepicker.regional['fr'] = {
        closeText: 'Fermer',
        prevText: 'Précédent',
        nextText: 'Suivant',
        currentText: 'Aujourd\'hui',
        monthNames: ['janvier', 'février', 'mars', 'avril', 'mai', 'juin',
            'juillet', 'août', 'septembre', 'octobre', 'novembre', 'décembre'],
        monthNamesShort: ['janv.', 'févr.', 'mars', 'avril', 'mai', 'juin',
            'juil.', 'août', 'sept.', 'oct.', 'nov.', 'déc.'],
        dayNames: ['dimanche', 'lundi', 'mardi', 'mercredi', 'jeudi', 'vendredi', 'samedi'],
        dayNamesShort: ['dim.', 'lun.', 'mar.', 'mer.', 'jeu.', 'ven.', 'sam.'],
        dayNamesMin: ['D','L','M','M','J','V','S'],
        weekHeader: 'Sem.',
        dateFormat: 'dd/mm/yy',
        firstDay: 1,
        isRTL: false,
        showMonthAfterYear: false,
        yearSuffix: ''
    };
 
    $.datepicker.setDefaults( $.datepicker.regional[ 'fr' ] );

Avec ce code le format du texte est toujours 'dd/mm/yy', exemple : 01/01/2014.

Pour transformer ce texte en Date :

Code JS :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
var dateStr = $.trim( $( "#datepicker" ).val() );
 
var date = new Date(
    dateStr.slice( 6 ), // yyyy
    parseInt( dateStr.slice( 3, 5 ), 10 ) - 1, // mm - 1
    parseInt( dateStr.slice( 0, 2 ), 10 )  // dd
);

Exemple