Πως διορθώνουμε το input με type date σε Mozilla

Το πεδίο (input) με τύπο date της HTML5 δουλεύει μια χαρά σε chrome. Σε mozilla όμως έχουμε πρόβλημα καθόσον η επιλογή ημερομηνίας δεν εμφανίζεται. Το λύνουμε προσθέτοντας τα απαραίτητα jquery libs και ένα μικρό function. Προσθέτοντας το datepicker λοιπόν καταφέρνουμε να εμφανίσουμε την επιλογή ημερομηνίας. Τώρα όμως το chrome βγάζει 2 datepickers. Για να το λύσουμε απλά προσθέτουμε το function isChrome() όπου βρίσκουμε τον browser του χρήστη και ακυρώνουμε στην ουσία το πρώτο σενάριο.

function isChrome() {
  var isChromium = window.chrome,
    winNav = window.navigator,
    vendorName = winNav.vendor,
    isOpera = winNav.userAgent.indexOf("OPR") > -1,
    isIEedge = winNav.userAgent.indexOf("Edge") > -1,
    isIOSChrome = winNav.userAgent.match("CriOS");

  if (isIOSChrome) {
    return true;
  } else if (
    isChromium !== null &&
    typeof isChromium !== "undefined" &&
    vendorName === "Google Inc." &&
    isOpera === false &&
    isIEedge === false
  ) {
    return true;
  } else { 
    return false;
  }
}
</script>
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script>
if (isChrome()) {}
else {
    $(function(){
         $('input[type="date"]').datepicker();
    });
	}
</script>

Ηλεκτρονικός Μηχανικός - MSc in Networking & Data Communications - Ασχολούμαι με το Web Design και τον προγραμματισμό μια δεκαετία. Δεν δίνω ούτε μια δεκάρα για προϊόντα της apple και καταναλώνω αρκετές ώρες καθημερινά στο gaming. Ξεκινάω συνεχώς νέα project χωρίς να υπάρχει τις περισσότερες φορές η προοπτική του κέρδους. Μισώ του δημοσιογράφους. Όλους. Έναν προς έναν.

Website: http://www.digispot.gr

About DigiSpot