Datetimepicker Reset to current date after finishing ajax. How to stop it?

I am using thickbox. In thickbox, datetime picker is in another div. Ajax data is update in another div.

In thickbox on change on period dropdown calling ajax. But after ajax complete datatimepicker value is reset to current datetime.

Datetimepicker value should be retain after ajax.

May be it trigger from “Date Time Picker Field wordpress plugin” or It above issue is dueto thickbox.

Please help me how can i fix this issue.

HTML CODE

<div id="learning_link_thickbox" style="display:none;">
  <form action="" id="shareLearningLinkForm">
    <p>Only Show This Period :
      <select name="period_dropdown" id="period_dropdown">
        <option value="">ALL</option>
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
      </select>
    </p>  
    <input name="post_id" type="hidden" value="<?= $post_id ?>">
    <div id="loader_student_list"></div>
    <div class="student_list_by_period">
      Ajax data display here.
    </div>

    <div class="schedule_later">
        <input type="text" name="sl_datetimepicker" id="sl_datetimepicker" class="sl_datetimepicker">
    </div>
    <input type="submit" value="Send"> 
  </form>
</div>

<a href="#TB_inline?&inlineId=learning_link_thickbox" class="thickbox">Share</a>

Ajax call

jQuery(document).ready(function($) {
    $("#period_dropdown").change(function() {
	var period = $(this).val();
	$.ajax({
		url: customObj.ajaxurl,
		data: {
			'action': 'student_list_by_period',
			'period' : period
		},
		beforeSend: function(){
			$("#loader_student_list").show();
		},
		success:function(data) {
			$('.student_list_by_period').html(data);
		},
		error: function(errorThrown){
			console.log(errorThrown);
		},
		complete:function(data){
			$("#loader_student_list").hide();
		}
	});
   });
});