2
Hallo, ich habe drei Arten von Datepicker im gleichen Eingabefeld basierend auf Auswahloption in diesem Datum Wert funktioniert gut, wenn ich Jahr Option nach der Auswahl Monat Wert, es ist nicht richtig platziert, zum Beispiel wenn ich Monat wählen Option aug-2016 wird es richtig platziert, wenn ich zum Jahr Option 2015 komme, wird es 2016 nur ähnlich platziert, wenn ich zu Jahr Option komme bedeutet Monat Wert nicht korrekt platziert das Problem ist Fokus-Funktion nicht klar, ich bin versuchte Unschärfe-Option die Fokus-Funktion zu entfernen, aber mein Code nicht funktioniert unterDatepicker Fokusfunktion
<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>jQuery UI Datepicker - Default functionality</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<style id='hideMonth'></style>
</head>
<body>
<select name="rep_type" id="rep_typ" onchange="opt_change()">
<option selected="selected" >TYPE</option>
<option disabled="disabled"></option>
<option value="1" >DATE</option>
<option value="2">MONTH</option>
<option value="3" >YEAR</option>
</select>
<input id="date_input" type="text" value="" size="10" />
<script>
function opt_change()
{
var sel_value=$("#rep_typ option:selected").val();
$("#date_input").datepicker("destroy");
$('#date_input').val("");
if(sel_value==1)
{
$("#date_input").datepicker({
beforeShow: function()
{
$('#hideMonth').html('.ui-datepicker-calendar{display:show;}');
},
showButtonPanel: false,
maxDate:0,
changeMonth: true,//this option for allowing user to select month
changeYear: true, //this option for allowing user to select from year range
dateFormat: "yy-mm-dd",
yearRange: '2015:+0'
});
}
else if(sel_value==2)
{
$("#date_input").datepicker({
beforeShow: function()
{
$('#hideMonth').html('.ui-datepicker-calendar{display:none;}');
},
maxDate:0,
changeMonth: true,//this option for allowing user to select month
changeYear: true, //this option for allowing user to select from year range
dateFormat: "yy-mm",
showButtonPanel: true,
yearRange: '2015:+0'
}).focus(function() {
var thisCalendar = $(this);
$('.ui-datepicker-close').click(function() {
var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
thisCalendar.datepicker('setDate', new Date(year, month, 1));
$(".ui-datepicker-calendar").hide();
});
});
}
else if(sel_value==3)
{
$("#date_input").datepicker({
beforeShow: function()
{
$('#hideMonth').html('.ui-datepicker-calendar{display:none;}');
},
maxDate:0,
changeMonth: false,//this option for allowing user to select month
changeYear: true, //this option for allowing user to select from year range
dateFormat: "yy",
showButtonPanel: true,
stepMonths: 0,
monthNames: ["", "", "", "", "", "", "", "", "", "", "", ""],
yearRange: '2015:+0'
}).focus(function() {
var thisCalendar = $(this);
$('.ui-datepicker-close').click(function() {
var year1 = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
thisCalendar.datepicker('setDate', new Date(year1,1));
$(".ui-datepicker-calendar").hide();
});});
}
}
</script>
</body>
</html>
Bitte geben Sie mir Ihre Führung den richtigen Wert in Eingabefeld zu platzieren basierend auf der Auswahl
Sie die Datepicker ** einmal instanziiert sollte **, und dann ändern Sie einfach die Optionen, wenn die Auswahl Ändern – adeneo
Bitte geben Sie mir das Beispiel – Sathish
Wie die Option – Sathish