Comment effacer le texte saisi sur datetimepicker?

Question

Demo et code complet comme celui-ci:

https://jsfiddle.net/oscar11/yfjvd200/

Je veux que le datepicker et timepicker pas rempli lors du chargement de la première fois. Je veux que l'outil datepicker ou timepicker soit rempli lorsque l'utilisateur clique sur le texte d'entrée de chacun. Par exemple, l'utilisateur cliquez sur la saisie de texte timepicker alors le temps sera rempli

J'essaie d'utiliser ceci:

$('#datepicker').val(""); 
    $('#timepicker').val(""); 

Mais cela ne fonctionne pas

Comment puis-je faire?

Answer 1

Vous avez trouvé la bonne astuce!

$('#datepicker').val(""); 
$('#timepicker').val(""); 

Mais vous ne le faites pas au bon moment. Placez-les APRÈS que les cueilleurs aient été instanciés.

Pour remplir le temps sur le focus, ajoutez .on() à timepicker:

$('#timepicker').datetimepicker({ 
    minDate: moment().add(300, 'm'), 
}) 
    .on('focus', function(e){ 
    if($(this).val() == ""){ 
    $(this).data("DateTimePicker").minDate(moment().add(300, 'm')); 
    } 
}); 

Fiddle

Answer 2

Jetez un oeil à ce violon https://jsfiddle.net/lamp03/yfjvd200/9/. Je l'ai commenté quelques lignes

$(function() { 
    //$('#datepicker').val(""); 
    //$('#timepicker').val(""); 
    console.clear(); 

    $('#datepicker').datetimepicker({ 
    minDate: moment().add(300, 'm').startOf("day") 
    }) 
    //.val(moment().add(300, 'm').format("DD-MM-YYYY")) // To set correct "valid" date from start 

    .on('dp.change', function(e){ 
    var now = moment().format("X"); 
    //console.log(e.date.format("X")); 
    //console.log(now); 

    // Comparing selected date (moment object) in milliseconds 
    if(e.date.format("X")+(300*60*1000) > now){ 
     console.log("above 5 hours, unlocking time."); 
     $('#timepicker').data("DateTimePicker").minDate(false); 
    }else{ 
     console.log("below 5 hours, locking time (and probably resetting the value to min...)"); 
     $('#timepicker').data("DateTimePicker").minDate(moment().add(300, 'm')); 
    } 

    }); 

    $('#timepicker').datetimepicker({ 
    //minDate: moment().add(300, 'm'), 
    }).on('dp.change', function(e){ $('#timepicker').data("DateTimePicker").minDate(moment().add(300, 'm'));}); 
}); 

Answer 3

Vous avez juste besoin d'écrire ces lignes à la fin de votre fonction:

$('#datepicker').val(""); 
$('#timepicker').val(""); 

Vous pouvez utiliser ce code:

$(function() { 
    console.clear(); 

    $('#datepicker').datetimepicker({ 
    minDate: moment().add(300, 'm').startOf("day") 
    }) 
    .val(moment().add(300, 'm').format("DD-MM-YYYY")) // To set correct "valid" date from start 

    .on('dp.change', function(e){ 
    var now = moment().format("X"); 
    //console.log(e.date.format("X")); 
    //console.log(now); 

    // Comparing selected date (moment object) in milliseconds 
    if(e.date.format("X")+(300*60*1000) > now){ 
     console.log("above 5 hours, unlocking time."); 
     $('#timepicker').data("DateTimePicker").minDate(false); 
    }else{ 
     console.log("below 5 hours, locking time (and probably resetting the value to min...)"); 
     $('#timepicker').data("DateTimePicker").minDate(moment().add(300, 'm')); 
    } 

    }); 

    $('#timepicker').datetimepicker({ 
    minDate: moment().add(300, 'm'), 
    }); 

    $('#datepicker').val(""); 
    $('#timepicker').val(""); 
});