Html ile Textbox'u DatePicker Nasıl Yapılır Textbox tarih formatı

Editör 27.02.2017 21:11 Html
Html ile Textbox'u DatePicker Nasıl Yapılır Textbox tarih formatı

Merhabalar;

Tasarladığımız formlarda kullanmak üzere textbox vya input text kontrollerinde tarih formatı ve datepicker özelliği bvermek istersek aşağıdaki kodları uygulayarak yapabiliriz.

HTML Code:

    <body>
<input type="date" id="dt" onchange="mydate1();" hidden/>
<input type="text" id="ndt"  onclick="mydate();" hidden />
<input type="button" Value="Date" onclick="mydate();" />
</body>

CSS Code:

#dt{text-indent: -500px;height:25px; width:200px;}

Javascript Code :

function mydate()
{
  //alert("");
document.getElementById("dt").hidden=false;
document.getElementById("ndt").hidden=true;
}
function mydate1()
{
 d=new Date(document.getElementById("dt").value);
dt=d.getDate();
mn=d.getMonth();
mn++;
yy=d.getFullYear();
document.getElementById("ndt").value=dt+"/"+mn+"/"+yy
document.getElementById("ndt").hidden=false;
document.getElementById("dt").hidden=true;
}

 Farklı örnek içibn http://digitalbush.com/projects/masked-input-plugin/

Bunlarada Bakabilirsiniz