Position von Datepicker in Modelpopup Textbox ändern

Question

Ich arbeite an einem ASP.Net Webformular, das AJAX Modelpoup Extender und jquery nepali-datepicker enthält. Ich muss nepali-datepicker zu einer Textbox integrieren, die in meinem zweiten ist, d. H. Mit blauem Hintergrund wie im Bild unten gezeigt. Problem ich bin vor ist, dass ich nicht in der Lage bin datepicker unten auf Position von textbox

Basierend auf den Antworten auf der Post (How to change the pop-up position of the jQuery DatePicker control) konnte ich picker vor 2.em Modell Pop-up bringen. Gibt es einen Weg, den ich verwenden kann, um datepicker tatsächlich in die Textbox zu positionieren.

Hier ist mein Skript und Stile:

<script type="text/javascript">   
    function pageLoad() { 
     $('.nepali-calendar').nepaliDatePicker(); 
    } 

    $(document).ready(function() { 
     $('.nepali-calendar').nepaliDatePicker(); 

    }); 
</script>  

<style type="text/css"> 
    div#ndp-nepali-box 
    { 
     position:absolute; 
     z-index: 999999; 
    } 
</style> 

folgende Abbildung zeigt, wie ist es jetzt positioniert ist.

Wenn ich position als relative verwende.

<style type="text/css"> 
    div#ndp-nepali-box 
    { 
     position: relative; 
     z-index: 999999; 
    } 
</style> 

Es sieht aus wie

Gibt es eine Möglichkeit, dass ich tatsächlich picker zu positionieren Boden der Textbox verwenden können.

Answer 1

relative Position Versuchen:

<style type="text/css"> 
    div#ndp-nepali-box 
    { 
     position: relative; 
     z-index: 999999; 
    } 
</style> 

Ich weiß nicht, was ist div # ndp-nepali-Box, aber versuchen, dies zu tun:

<style type="text/css"> 
    .ui-datepicker 
    { 
     position: relative; 
     z-index: 999999; 
    } 
</style> 

kann es wichtig sein

Answer 2

Wie Sie jquery UI Datepicker verwenden, sollte es beforeShow Eigenschaft haben und css innerhalb dieser Eigenschaft wie unten ändern.

prüfen diese fiddle

$('input.date').datepicker({ 
beforeShow: function(input, inst) { 
var cal = inst.dpDiv; 
var top = $(this).offset().top + $(this).outerHeight(); 
var left = $(this).offset().left; 
setTimeout(function() { 
    cal.css({ 
     'top' : top, 
     'left': left 
    }); 
}, 10); 
} 
}); 

Reference