0

I have very simple form which i want to validate by using required attribute :

          <form name="form">
                <label for="Header">Overskrift</label>
                <input type="text" class="span5" name="Header" ng-model="Message.header" placeholder="Overskrift" oninvalid="this.setCustomValidity('Indtast overskrift')"  required />

                <label for="Body">Tekst</label>
                <textarea name="Body" class="span5" ng-model="Message.body" rows="10" cols="20" placeholder="Besked" oninvalid="this.setCustomValidity('Indtast Tekst')" required />
                <input type="submit" class="btn btn-primary" value="Send" ng-click="send()" />
            </form>

but doesnt matter how i fill out the form first field is always invalid and error message is shown, what am i doing wrong?

Timsen
  • 4,066
  • 10
  • 59
  • 117
  • 1
    You should not use the self-closing syntax ``, unless your page is intended to work only in XHTML mode, sent with an XML content type. – Jukka K. Korpela Mar 09 '14 at 07:11
  • Regarding the basic problem, this is a duplicate, though the problem is incompletely described here. The point is that *after trying to submit data* with some error detected, the field has custom validity set, and this can only be changed by setting it to '', not by direct user actions. – Jukka K. Korpela Mar 09 '14 at 07:16
  • 1
    possible duplicate of [HTML5: Why does my "oninvalid" attribute let the pattern fail?](http://stackoverflow.com/questions/16867407/html5-why-does-my-oninvalid-attribute-let-the-pattern-fail) – Jukka K. Korpela Mar 09 '14 at 07:17

1 Answers1

1

Why don't you use the standard AngularJS form validation controls? Like:

<input type="text" class="span5" name="Header" ng-model="Message.header" placeholder="Overskrift" required />

And you could check the validity of your field as

$scope.form.Header.$dirty && $scope.form.Header.$invalid

where $dirty is an indicator if the field has been modified and $invalid indicates that the input field does not contain a valid value. See the AngularJS docs on forms for more info about it

Sandor Nemeth
  • 143
  • 6