jQuery Datepicker für mehrere Eingänge

Question

Ich habe ein jQuery Datepicker-Skript:

  $(function() { 
       $("#datepicker").datepicker({ dateFormat: "yyyy-mm-dd" }); 
      }); 

Als ich das Skript für die zwei Eingänge initialisiert werden soll, ist es nur für die erste funktioniert. Wie man es für beide Eingänge benutzt?

<input type="text" name="MyDate1" id="datepicker"> 
<input type="text" name="MyDate2" id="datepicker"> 

Answer 1

einfach alle id-class ändern.

<input type="text" name="MyDate1" class="datepicker"> 
<input type="text" name="MyDate2" class="datepicker"> 

$(function() { 
    $(".datepicker").datepicker({ dateFormat: "yyyy-mm-dd" }); 
}); 

können auch

$(function() { 
    $("input[name^=MyDate]").datepicker({ dateFormat: "yyyy-mm-dd" }); 
}); 

Answer 2

Es ist nicht gültig dupliziert IDs haben verwenden. Sie sollten eine Klasse hinzufügen:

<input type="text" name="MyDate1" class="datepicker" id="datepicker1"> 
<input type="text" name="MyDate2" class="datepicker" id="datepicker2"> 

Dann können Sie tun:

 $(function() { 
      $(".datepicker").datepicker({ dateFormat: "yyyy-mm-dd" }); 
     }); 

Answer 3

müde, dies zu wiederholen, aber immer noch, ich wiederhole ihn noch einmal. id s müssen eindeutig sein. So verwenden Sie diese:

<input type="text" name="MyDate1" class="datepicker"> 
<input type="text" name="MyDate2" class="datepicker"> 

mit

$(function() { 
    $(".datepicker").datepicker({ dateFormat: "yyyy-mm-dd" }); 
}); 

Answer 4

Zugang picker Funktion von Name:

$(function() { 
     $('[name="MyDate1"]').datepicker({ dateFormat: "yyyy-mm-dd" }); 
     }); 

Answer 5

Sie können auch Klassen on the fly hinzufügen, wenn Eingabefelder dynamisch erzeugt werden, wie zum Beispiel in Django Vorlagen.

<input type="text" name="MyDate1" id="datepicker1"> 
<input type="text" name="MyDate2" id="datepicker2"> 

Get Eingabefelder #id mit und fügen eine Klasse

$(function() { 
    $("#datepicker1, #datepicker2").addClass('datepicker'); 
    $(".datepicker").datepicker({ dateFormat: "yy-mm-dd" }); 
}); 

Answer 6

<script> 
    $(document).ready(function() { 
    $("#datepicker").datepicker(); 
    }); 
    $(document).ready(function() { 
    $("#datepicker2").datepicker(); 
    }); 
    $(document).ready(function() { 
    $("#datepicker3").datepicker(); 
    }); 
    </script> 

und genau die Formen die ids geben: picker datepicker2 datepicker3