H5 script DatePicker does not work in New UI

Legacy Contributor

Hi, 

In the New UI, the datepicker is not populating but it works fine in classic UI. Please let me know if anyone has an idea.  

I have attached the code here, 

var userContext = ScriptUtil.GetUserContext();
this.DTFM = userContext['DTFM'];
var textElement1 = new TextBoxElement();
textElement1.Name = "CustomerReqDelDateTextBox";
textElement1.Position = new PositionElement();
textElement1.Position.Top = 11;
textElement1.Position.Left = 53;
textElement1.Position.Width = 9;
textElement1.DateFormat = this.DTFM;
var contentElement1 = this.controller.GetContentElement();
var $dateElem1 = contentElement1.AddElement(textElement1);
$dateElem1.inforDateField({
hasInitialValue: true,
openOnEnter: false,
beforeShow: function() {
if ($(this).val() == "") {
$(this).datepicker("setDate", new Date());
}
},
onClose: function() {
var formatdatew = $(this).val();
console.log(formatdatew);
$("#CustomerReqDelDateTextBox").val(formatdatew);
},
});

Legacy Contributor

Hi Divya,

Can you try this one?

var userContext = ScriptUtil.GetUserContext();
this.DTFM = userContext['DTFM'];
var textElement1 = new TextBoxElement();
textElement1.Name = "CustomerReqDelDateTextBox";
textElement1.Position = new PositionElement();
textElement1.Position.Top = 5;
textElement1.Position.Left = 40;
textElement1.Position.Width = 9;
textElement1.DateFormat = this.DTFM;

// Additional codes for version >= 2.0
// Flag that the element is datepicker type
textElement1['type'] = 5;
// New UI datepicker can only handle 6-character date format
textElement1['dateFormat'] = this.DTFM.replace(/Y/gi, 'YY').replace(/M/gi, 'MM').replace(/D/gi, 'DD');

var contentElement1 = this.controller.GetContentElement();
var $dateElem1 = contentElement1.AddElement(textElement1);
// $dateElem1.inforDateField({
// hasInitialValue: true,
// openOnEnter: false,
// beforeShow: function() {
// if ($(this).val() == "") {
// $(this).datepicker("setDate", new Date());
// }
// },
// onClose: function() {
// var formatdatew = $(this).val();
// console.log(formatdatew);
// $("#CustomerReqDelDateTextBox").val(formatdatew);
// },
// });

Call to inforDateField method is no longer available when creating datepicker in the new UI.