From e12db36f4a34e7f0db1bca9f7da0f956c8bf19e7 Mon Sep 17 00:00:00 2001 From: George Kalpakas Date: Tue, 6 Mar 2018 15:31:27 +0200 Subject: [PATCH 1/2] docs(input[radio]): explain what happens with same name on multiple inputs Closes #15009 --- src/ng/directive/input.js | 25 +++++++++++++++++++++++++ 1 file changed, 25 insertions(+) diff --git a/src/ng/directive/input.js b/src/ng/directive/input.js index 3b841d25a348..62bed17a5ec5 100644 --- a/src/ng/directive/input.js +++ b/src/ng/directive/input.js @@ -980,6 +980,31 @@ var inputType = { * @description * HTML radio button. * + * **Note:**
+ * All inputs controlled by {@link ngModel ngModel} (including those of type `radio`) will use the + * value of their `name` attribute to determine the property under which their + * {@link ngModel.NgModelController NgModelController} will be published on the parent + * {@link form.FormController FormController}. Therefore, you should avoid using the same `name` + * for multiple inputs of a form, or else they will overwrite each other's `NgModelController` on + * the parent `FormController`. + * + *
+ *

+ * In plain HTML forms, the `name` attribute is used to identify groups of radio inputs, so + * that the browser can manage their state (checked/unchecked) based on the state of other + * inputs in the same group. + *

+ *

+ * In AngularJS forms, this is not necessary. The input's state will be updated based on the + * value of the underlying model data. + *

+ *
+ * + *
+ * If you omit the `name` attribute on a radio input, `ngModel` will automatically assign it a + * unique name. + *
+ * * @param {string} ngModel Assignable AngularJS expression to data-bind to. * @param {string} value The value to which the `ngModel` expression should be set when selected. * Note that `value` only supports `string` values, i.e. the scope model needs to be a string, From fbdca6639665db406d6494135b722d927266fbc6 Mon Sep 17 00:00:00 2001 From: George Kalpakas Date: Thu, 8 Mar 2018 19:12:34 +0200 Subject: [PATCH 2/2] fixup! docs(input[radio]): explain what happens with same name on multiple inputs --- src/ng/directive/input.js | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/src/ng/directive/input.js b/src/ng/directive/input.js index 62bed17a5ec5..5d9bf66fa468 100644 --- a/src/ng/directive/input.js +++ b/src/ng/directive/input.js @@ -984,9 +984,11 @@ var inputType = { * All inputs controlled by {@link ngModel ngModel} (including those of type `radio`) will use the * value of their `name` attribute to determine the property under which their * {@link ngModel.NgModelController NgModelController} will be published on the parent - * {@link form.FormController FormController}. Therefore, you should avoid using the same `name` - * for multiple inputs of a form, or else they will overwrite each other's `NgModelController` on - * the parent `FormController`. + * {@link form.FormController FormController}. Thus, if you use the same `name` for multiple + * inputs of a form (e.g. a group of radio inputs), only _one_ `NgModelController` will be + * published on the parent `FormController` under that name. The rest of the controllers will + * continue to work as expected, but you won't be able to access them as properties on the parent + * `FormController`. * *
*