javascript - Angularjs error validation for dropdown/select redirect with ng-href -
i'm using angularjs's ng-href , select html element ng-model using ng-href link "selecteditem" (from ng-model). unable validate or provide error when nothing chosen , wondering how this. ng-href works, think doesn't have same functionality on plunker.
heres html code:
<form name="linkform" ng-controller="mainctrl"> <select name="link" ng-model="selecteditem" ng-options="item item.name item in items"></select> <option value=""></option> <span class="error" ng-show="linkform.link.$dirty && linkform.link.$invalid">please select website</span> <a ng-href="{{selecteditem.id}}">let's go</a> </form>
heres angularjs code
var app = angular.module('angularjs-starter', []); app.controller('mainctrl', function($scope) { $scope.items = [ { id: 'http://www.google.com', name: 'google'}, { id: 'http://www.gmail.com', name: 'gmail'}]; });
heres demo: http://plnkr.co/edit/c9iilp6spvqk8jydmyhd?p=preview
you need add required
select in order make option necessary validation. however, need remove check bankloginform.banklogin.$dirty
, since won't dirty until user modifies dropdown. make href disappear when dropdown invalid, can add opposite check on it.
<select name="banklogin" ng-model="selecteditem" ng-options="item item.name item in items" required> <option value=""></option> </select> <span ng-show="bankloginform.banklogin.$invalid">select bank</span> <a ng-href="{{selecteditem.id}}" ng-show="!bankloginform.banklogin.$invalid">let's go</a>
Comments
Post a Comment