jcubic jcubic - 3 months ago 15
AngularJS Question

Naming textarea don't create instance in form in angular

I have this jade template for modal dialog using angular material (couldn't convert to html because the jade site is not working):

md-dialog(aria-label='Reject', ng-cloak='')
form(name="rejectionForm")
md-dialog-content
.md-dialog-content
h2.md-title Reject confirmation for
div(ng-bind-html="vm.parent.task.label")
div {{rejectionForm | json}}
textarea(placeholder="Please provide a reason for rejection", name="reason", style="width: 530px; height: 75px", ng-required="true")
div(ng-messages="rejectionForm.reason.$error")
div(ng-message="required") You need to give the reason
md-dialog-actions(layout="row")
span(flex)
md-button(ng-click="vm.parent.cancel()") CANCEL
md-button.md-primary.md-raised(ng-click="vm.parent.reject()", ng-disabled="rejectionForm.$invalid") REJECT


it should create instance of form field in
rejectionForm
called
reason
but the resulting json look like this:

{
"$error": {},
"$name": "rejectionForm",
"$dirty": false,
"$pristine": true,
"$valid": true,
"$invalid": false,
"$submitted": false


}

why there is no
reason
and why is my form not validated?

Answer

Unless you have ng-model over input element with name attribute of form, it wouldn't add that name property in rejectionForm form object.

You should put ng-model="something" to get reason get populated inside rejectionForm form.