i have downloaded bootstrap admin template from google to use in my web application.

Now i want to use datetimepicker using jquery on asp:textbox

Here is html control on which jquery is applied

<input type="text" class="form-control" value="02-16-2012" id="dp1" />

this works fine when i click on this control it pop up date time picker

but now i want to use this on my textbox

<asp:TextBox ID="txtDOB"    CssClass="form-control" runat="server"  />

but i didn't find any java script calling method from html control such that i add it to my asp control. i even change ID of asp textbox to dp1 but it didn't work.

i need your precious suggestions to solve it. thanks in advance

EDIT: I got solution thanks for your precious time.

i just give link of new jquery and deleted old one. now its working fine

thanks experts, i appreciate your cooperation.

3 Answers

1
Shehary On

May be the ID of the textbox isn't txtDOBit might be ctrl00-ucDatePicker-txtDOB or something as asp.net generate the IDs on the fly.

I think you should try with class

<asp:Textbox ID="txtDOB" CssClass="form-control date-picker" runat="server" />

then apply use a class selector rather than an ID selector txtDOB

$(".date-picker").datepicker();

or you can try a partial ID picker

$("input[id*=txtDOB]").datepicker();
2
Rajesh On

use a common class on textbox to call date picker. Add this script in a common place and only use a common class in the textboxes wher ever you want to open date picker

<asp:TextBox ID="txtDOB"    CssClass="form-control DatePick" runat="server"  />

<script>
$(document).ready(function() {
        _fn_date_picker();
    });

 function _fn_date_picker() {
        $(".DatePick").datepicker({ dateFormat: "dd/mm/yy", yearRange:"1900:2200", changeMonth: true, changeYear: true, showOtherMonths: true, selectOtherMonths: true, onSelect: function() { this.fireEvent && this.fireEvent('onchange') || $(this).change(); } });
    }
</script>
1
Jai On

Either use it with class name:

$(".form-control").datetimepicker();

or make use of Control.ClientID:

$("#<%=txtDOB.ClientID %>").datetimepicker();   

Because asp changes the id of each element dynamically attaching some random numbers to it. So, <%=txtDOB.ClientID %> will let you get that id.


Noticed:

You are mentioning to use datetimepicker but you are initializing datepicker.