Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How do I get masked date in model from input in angular using ui-mask?

I have a view which requires that the user enter their birthdate into a textbox.

I am using the mask directive from UI-Utils.

My view has this input element in it:

<input ui-mask="99/99/9999" placeholder="MM/DD/YYYY" type="text" name="uBirthdate" ng-model="user.birthdate" required/>

and in my controller I have the scope set up as

myApp.controller('HomeCtrl', function ($scope, myService){

    $scope.user = registerService.getCurrentUser();

    $scope.submit = function () {
        //do something with $scope.user.birthdate
    };

    }
});

My issue is that in my controller, the birthdate property contains the value from the input WITHOUT the masking characters so an input of

11/20/1980 in the view becomes 11201980 as a property on the $scope

How can I make sure I have a valid masked date to work with in my controller? Just FYI, this date will be sent as JSON in a POST request to my server.

like image 497
stephen776 Avatar asked Jan 08 '14 15:01

stephen776


People also ask

What is mask in input angular?

InputMask Control (Angular) The InputMask control allows you to validate and format user input as it is entered, preventing users from entering invalid data. To use the control, set the mask property to a string that specifies the valid character classes for each input position.

How do I make an input mask?

In the Navigation Pane, right-click the object and click Design View on the shortcut menu. Click the field where you want to create the custom input mask. In the Field Properties area, click the Input Mask text box, and then type your custom mask. Press CTRL+S to save your changes.

What is UI mask?

UI masking solutions help organizations improve data protection and comply with internal and legal requirements to restrict access to specific data. They enable detailed configuration of sensitive fields, refining and working in parallel to SAP's existing authorization concepts.


2 Answers

Upgrade to the lastest angular-ui and use the following syntax

ui-mask="99/99/9999" model-view-value="true"

The model-view-value will keep the mask on your model object.

like image 185
map7 Avatar answered Oct 05 '22 00:10

map7


try this one https://github.com/candreoliveira/ngMask help full for all mask

like image 27
Ashish Gupta Avatar answered Oct 05 '22 00:10

Ashish Gupta