AngularJS / JQuery - form input without an associated label

3.4k views Asked by At

I have a problem with "Form input without an associated label". This appears on [textarea], [select], [select], [input] classes.

Here is my code:

<div class="panel-body">
<form name="f" data-ng-submit="addTodo()">
  Nazwa:
  <textarea class="form-control" name="newTodo" data-ng-model="formData.newTodo" required></textarea>
  Typ:
  <select class="form-control" name="type" data-ng-model="formData.type" data-ng-option="value.name for value in categories" required></select>
  Estymowany czas:
  <select class="form-control" name="estimates" data-ng-model="formData.estimates" data-ng-option="value + 'h' for value in [] | rangeTime:9:true" required></select>
  Data:
  <input class="form-control" type="text" data-ng-model="formData.date" data-ng-data-picker="" name="date" required readonly="readonly">
  <br />
  <button class="btn btn-success" data-ng-disabled="f.$invalid">Add <span class="glyphicon glyphicon-ok"></span></button>
</form>

Thanks for help!

Moderator Clarification: The quoted message stated above is a warning provided by JetBrains products within the IDE. The OP is most likely using either WebStorm or IntelliJ for front-end development.

2

There are 2 answers

0
dfsq On BEST ANSWER

This is not an error, however it's recommended to associate labels with corresponding form elements for the sake of UX convenience. For example for the name field:

<label for="name">Nazwa:</label>
<textarea class="form-control" id="name" name="newTodo" data-ng-model="formData.newTodo" required></textarea>

I assume your IDE is smart enough to identify missing labels and provide you with a reasonable suggestion to add those.

0
tangkikodo On

I guess WebStorm?

just follow the advice and add the label. label is useful especially for radio, checkbox so that you can active them by merely clicking on the label.