jQuery datePicker zeigt nur bei der ersten Instanziierung der Seite

Question

Ich habe mehrere Seiten, die aus einem Hauptmenü aufgerufen werden und laden über jQuery in ein Content-Div. Die meisten dieser Seiten enthalten ein jQuery UI datePicker-Widget.

In jedem Fall funktioniert der datePicker gut, wenn die Seite die erste "datepicker page" ist, die aus dem Menü geladen wurde (index.php).

Sobald jedoch die ursprüngliche "datepicker page" ersetzt wurde (selbst wenn sie durch sie ersetzt wurde), funktioniert datePicker nicht.

$.datepicker.setDefaults({ 
    showOn: "focus", 
    showOtherMonths:true, 
    selectOtherMonths:true, 
    numberOfMonths:[4,3], 
    defaultDate : -330 
    }); 

$(function() { 
    $("input#begdate").datepicker(); 
    $("input#enddate").datepicker(); 
    $("input#received").datepicker(); 
    $("input#due").datepicker(); 
    $("input#dtpaid").datepicker(); 
}); 

Wenn ich laden eine andere Seite, dass eine Datepicker Seite, dann die erste Seite geladen mit picker normal funktioniert.

Danke!

Okay, ich habe die Dinge ein bisschen verändert. Aber ich habe immer noch das gleiche Ergebnis. Dieser Code ist der erste Code im Skript (nach document.ready) für die zugehörige Seite

$(function() { 
     init_datepickers(); 
    }); 


     function init_datepickers() { 
     $("input#received").datepicker(); 
     $("input#due").datepicker(); 
     $("input#eddue").datepicker(); 
     $("input#edreceived").datepicker(); 
    } 

Ich verstehe nicht, warum das nicht funktioniert. Es funktioniert perfekt, solange die Seite eigenständig ist und nicht in ein Div geladen wird.

Sorry, so dick zu sein!

Answer 1

können Sie entweder neu initialisiert alle Elemente mit Datapicker so etwas wie:

$('.datepickerDIV').load('name_of_file.php', function(){ 
    $(".datepickerDIV").datepicker(); 
}); 

Oder Sie können Script-Tags mit gleichen Informationen innerhalb Laden des Inhalts enthalten. Erstens ist offensichtlich vorzuziehen, aber die zweite Methode funktioniert auch.

another_page.php

<script> 
    $("#datepicker3").datepicker(); 
</script> 
<div id="datepicker3" class="datepickerDIV"></div> 

Answer 2

Das Problem ist, dass man sie nur $() beim ersten Laden initialisieren - jede neue picker muss auch initialisiert werden, nachdem es geladen wurde.

Sie können alle Ihre Kalenderwerkzeug eine CSS-Klasse geben, zB css='data-datepicker' und dann initialisieren jedes Mal wenn Sie neue Inhalte laden:

$(function() { 
    init_datepickers(); 
}); 

function init_datepickers() { 
    $(".data-datepicker").datepicker(); 
} 

... 
    $.ajax(... 
    ).complete(function() { init_datepickers(); })