spicykimchi
spicykimchi

Reputation: 1151

Concatenating three input fields into one model in angular

<input type="text" ng-model="expiry.year" />
<input type="text" ng-model="expiry.month" />
<input type="text" ng-model="expiry.date" />

{
expiration: expiry.year + expiry.month, expiry.date
}

How to concatenate this into one model?I have this inout fields exist in a multiple form.

Upvotes: 0

Views: 2927

Answers (2)

Raghavendra
Raghavendra

Reputation: 5387

<input type="text" ng-model="expiry.year" />
<input type="text" ng-model="expiry.month" />
<input type="text" ng-model="expiry.date" />

{{ expiration }}

You can setup a watch in your controller

$scope.$watch('expiry', function(newVal) {
    $scope.expiration = newVal.year + '-' + newVal.month + '-' + newVal.date
}, true);

Upvotes: 1

harishr
harishr

Reputation: 18065

not a complete solution but you can work along these lines

<input type="text" ng-model="expiry.year" ng-change="expiration = expiry.year + expiry.month, expiry.date" />
<input type="text" ng-model="expiry.month" ng-change="expiration = expiry.year + expiry.month, expiry.date"  />
<input type="text" ng-model="expiry.date" ng-change="expiration = expiry.year + expiry.month, expiry.date"  />

it does not handle undefined etc case. better would be to write a function and do the concatenation in controller...

<input type="text" ng-model="expiry.year" ng-change="expirationUpdated()" />
<input type="text" ng-model="expiry.month" ng-change="expirationUpdated()" />
<input type="text" ng-model="expiry.date" ng-change="expirationUpdated()" />

do it in function

var expirationUpdated = function() { ///concate logic here}

Upvotes: 1

Related Questions