CODEWITHSUNDEEP
angularjsng-messages
RuaTre
RuaTre

Reputation: 111

How to show ng-message when submit or lose focus with out exact some button click(cancel button)

I have form on a dialog with some input field and a submit, a cancel buttons. I use ng-message for show input is wrong. But when i click cancel with ng-click="$dismiss()" for disable dialog then ng-message is show and action dismiss() is terminate. Some suggestion for me to resolve case

<form name="accountGroupForm" novalidate>
            <div class="form-group"
                 >

                <input id="group-name" class="form-control" name="groupName" placeholder="{{'Group name' | translate}}"
                       ng-model="accountGroup.name" ng-focus="true"
                       required>

                <div ng-messages="accountGroupForm.groupName.$error" ng-if="accountGroupForm.groupName.$touched">
                    <div ng-message="required" class="help-block"><span translate>Group name is required</span></div>

                </div>
            </div>
            <div class="wrapper row">
                <div class="col-xs-6 text-right p-r-xs">
                    <button type="submit" class="hvr-grow btn btn-success w-sm"
                            ng-disabled="accountGroupForm.$invalid"
                            ng-click="submitAccountGroup()" translate>
                        Ok
                    </button>
                </div>
                <div class="col-xs-6 text-left p-l-xs">
                    <button class="hvr-grow btn btn-grey-blue w-sm" ng-click="$dismiss()" translate>Cancel
                    </button>
                </div>
            </div>
        </form>

Upvotes: 0

Views: 536

Answers (1)

Ross Rawlins
Ross Rawlins

Reputation: 667

you can add an ng-if to the ng-message with its own variable then you can set that variable on the desired action. I usually set it on the form validations for $error and $dirty.

ng-show='myForm.inputBox.$dirty && myForm.inputBox.$error'

Upvotes: 1

Related Questions