How to display select date from calendar icon button to aui:input tag

[Kushnoor Pathan, geändert vor 10 Jahren.]

Hi ,
On click on button I am getting the datepicker.Now I want to display the selected date from Datepicker to <aui:input> tag. Please help me on this. below is my sample code.

<div class="aui-datepicker aui-helper-clearfix" id="#<portlet:namespace />startDatePicker">
<aui:input type="text" inlineField="true" name="startDate" id="startDate" ></aui:input>
<button type="button" class="btn btn-primary" id="calendarIconButton"><i class="icon-calendar icon-white" ></i></button>
</div>

Here on button div i am triggering aui-datepicker.the selected value should display in aui:input text.

here is my javascript code
<aui:script use="aui-base,aui-datatype,calendar,aui-toggler,liferay-calendar-list,liferay-scheduler,liferay-store,json,aui-scheduler,aui-base,aui-dialog,aui-dialog-iframe,aui-io">

AUI().use('aui-datepicker', function(A) {

var startDatePicker = new A.DatePicker({

trigger: '#calendarIconButton',
popover: {
zIndex: 1
},


});

});

</aui:script>



I have tried some thing like this in my javascript ...
AUI().use('aui-datepicker', function(A) {

var startDatePicker = new A.DatePicker({

trigger: '#calendarIconButton',
popover: {
zIndex: 1
},


}).render('#<portlet:namespace />startDate');
Its giving me the TypeErro error

TypeError: (intermediate value).render is not a function
[Break On This Error]

}).render('#_broadcastcalendar_WAR_broadcastcalendarportlet_startDate');

kindly let me know the solution.


Thank you,
Kushnoor

[Parth Ghiya, geändert vor 9 Jahren.]

You can use the onSelection Method..!!

In On Selection Method Pass the Id Of the aui:input tag and set its value to the date Value.


Here is sample Code.

new Y.DatePicker(
{
trigger: '#fromDate',
calendar: {
dateFormat: '%m/%d/%Y'
},
mask: '%m /%d /%Y',
popover: {
zIndex: 1
},
on: {
selectionChange: function(event) {

Y.one("#fromDateTextBox").val(event.newSelection);
}
}
}
);


event.newSelection gives the current Date which you set it to an element with Id fromDateTextBox