Jquery Datepicker - in Modal

💬 General Discussion
1

Hi, I have created a custome module called Employee.
and I included custom js called custom js . Using this js , I have load modal on Button click. In that modal I have a jquery datepicker, it shows the datepicker, but when I click date , I`m getting error like

Uncaught TypeError: Cannot set property 'currentDay' of undefined
    at n._selectDay (sugar_grp1_jquery.js?v=RTia8A4OTD2mWI5GTvu4hw:6950)
    at HTMLTableCellElement.selectDay (sugar_grp1_jquery.js?v=RTia8A4OTD2mWI5GTvu4hw:6950)
    at HTMLTableCellElement.dispatch (sugar_grp1_jquery.js?v=RTia8A4OTD2mWI5GTvu4hw:3)
    at HTMLTableCellElement.r.handle (sugar_grp1_jquery.js?v=RTia8A4OTD2mWI5GTvu4hw:3)
_selectDay @ sugar_grp1_jquery.js?v=RTia8A4OTD2mWI5GTvu4hw:6950
selectDay @ sugar_grp1_jquery.js?v=RTia8A4OTD2mWI5GTvu4hw:6950
dispatch @ sugar_grp1_jquery.js?v=RTia8A4OTD2mWI5GTvu4hw:3
r.handle @ sugar_grp1_jquery.js?v=RTia8A4OTD2mWI5GTvu4hw:3

My datepicker Script is :

$(".datepicker").attr("style", "width: 999999 !important");
$("body").delegate(".datepicker", "focusin", function(){
	$(".datepicker").datepicker({
		dateFormat: "dd-mm-yy",
		changeMonth:true,
		changeYear:true
	});
});

Modal Query is:

var SI_mat_Table = '<div class="modal fade" id="SI_mat_details_modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" width="151">'+
'<div class="modal-dialog" id="SI_mat_modal_dialog" role="document" style="position: relative;overflow: auto;width: 80%;">'+
'<div class="modal-content">'+
'<div class="modal-header theme_bg" style="border: none;">'+
'<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>'+
'<h4 class="modal-title text-center">Service Invoice details for Materials:</h4>'+
'</div>'+
'<div class="modal-body">'+
'<table class="part_consumption_modal_controls table-responsive table-condensed" width="100%" border="0" cellspacing="1" cellpadding="0">'+
'<tbody>'+
'<tr>'+

'<th>Invoice Date</th>'+
'<td>'+ '<input type="text" class="datepicker" id="dob" placeholder="From Date" name="dob">'+'</td>'+                                  
'</tr>'+
'<tr>'+     
'</tr>'+
'</tbody>'+
'</table>'+


'</div>'+
'<div class="modal-footer text-center">'+
'<input type="button" class="btn button" data-dismiss="modal" onclick="submitMaterialInvoice()" id="submitMatrialInvoice" Value="Submit" >'+
'<input type="button" class="btn button" data-dismiss="modal" id="btn_submit" Value="Cancel" >'+
'</div>'+
'</div>'+
'</div>'+
'</div>';

$("#bootstrap-container").append(SI_mat_Table);