Tommaso Sebastianelli February 2016

AngularJS model parsing without user input event

I'm implementing Dale Lotts datetimepicker and dateTimeInput modules in my app;

//my input
<input data-ng-model="order.startDate" data-date-time-input="DD/MM/YYYY hh:mm" data-date-formats="['DD/MM/YYYY hh:mm', 'D/M/YYYY', 'D/M/YYYY h:mm', 'D/M/YYYY']" type="text" class="field start-field font-l inline numeric" ng-focus="datetime.order.start = true" />
//my datetimepicker
<datetimepicker id="datetime-order" data-on-set-time="datetime.order.start=false" data-ng-model="order.startDate" data-datetimepicker-config="{ minView: 'hour'}"></datetimepicker>

The input and the datetimepicker are binded together by data-ng-model so when i pick a date from the datetimepicker the value is formatted and displayed in the input.

data-model-type="YYYY-MM-DDTHH:mm:ss" in the input is added to adapt the model value in compatible format for my api, but it's not working: when i pick a date from the datetimepicker the input model is not formatted using the given params but it's formatted in the standard Data format instead. The model-type attribute only works when there is a user event directly on the input, followed by a blur event.

I tried to add a watcher on the input value and force the $parsers execution updating the $viewValue

//inside dateTimeInput directive
 return element.val();
}, function(){

but didn't work, and then i tried to simulate a user action on the input updating the element value and then triggering a blur event

     return element.val();
    }, function(){

but this


Tommaso Sebastianelli February 2016

I resolved simply configuring the datetimepicker model instead of parsing the input model:

<datetimepicker ... data-datetimepicker-config="{ minView: 'hour', **modelType: 'YYYY-MM-DDTHH:mm:ss'**}"></datetimepicker>

Post Status

Asked in February 2016
Viewed 2,910 times
Voted 5
Answered 1 times


Leave an answer