>>> [!note] Migrated issue <!-- Drupal.org comment --> <!-- Migrated from issue #3570148. --> Reported by: [bluegeek9](https://www.drupal.org/user/1286304) Related to !23 >>> <h3 id="summary-problem-motivation">Problem/Motivation</h3> <p>The Primary Entity Reference Options Buttons field widget has an undesirable behavior where users can select a primary entity reference using the radio button regardless of whether the corresponding checkbox is selected. This creates an inconsistent state where an unchecked item can be marked as primary.</p> <h4 id="summary-steps-reproduce">Steps to reproduce</h4> <ol> <li>Create a Primary Entity Reference field with the Options Buttons widget</li> <li>Configure the field to display checkboxes with radio buttons for primary selection</li> <li>Attempt to select a radio button for an item without first checking its checkbox</li> <li>Observe that the radio button can be selected even though the checkbox is unchecked</li> </ol> <h3 id="summary-proposed-resolution">Proposed resolution</h3> <p>Update the widget behavior to enforce the following rules:</p> <ul> <li><strong>Auto-select first checked item as primary:</strong> When no items are selected and a user checks the first checkbox, that item should automatically become the primary</li> <li><strong>Disable radio buttons for unchecked items:</strong> Radio buttons should be disabled unless their corresponding checkbox is checked</li> <li><strong>Clear primary on uncheck:</strong> If an item is unchecked and it was the primary, it should no longer be the primary, and no primary should be selected</li> <li><strong>Single item auto-primary:</strong> If only one checkbox is selected, it should automatically be set as the primary without requiring explicit radio button selection</li> <li><strong>Form submission validation:</strong> On form submit, if multiple checkboxes are selected but no primary is chosen, display an error message requiring the user to select a primary. If only one checkbox is selected, automatically set it as the primary and allow submission</li> <li><strong>JavaScript validation:</strong> Implement client-side JavaScript to enforce these rules and provide immediate feedback</li> </ul> <h3 id="summary-remaining-tasks">Remaining tasks</h3> <ul> <li>Update JavaScript in <code>js/primary-selection.js</code> to implement the new behavior</li> <li>Add form validation logic to check for primary selection on submit</li> <li>Implement auto-primary assignment for single-item selections</li> <li>Update CSS in <code>css/primary-selection.css</code> if needed for disabled state styling</li> <li>Add/update unit tests for the widget behavior including validation scenarios</li> <li>Test manually with various scenarios (single item, multiple items, checking/unchecking, form submission with no primary)</li> <li>Update documentation if necessary</li> </ul> <h3 id="summary-ui-changes">User interface changes</h3> <ul> <li>Radio buttons will be disabled (grayed out) when their associated checkbox is not checked</li> <li>The first checkbox that is checked will automatically have its radio button selected</li> <li>Unchecking a checkbox will automatically disable its radio button and deselect it if it was the primary</li> <li>If only one checkbox is selected, its radio button will be automatically selected as the primary</li> <li>On form submission, if multiple checkboxes are selected but no primary is chosen, an error message will be displayed: "You must select a primary entity reference when multiple items are selected"</li> </ul> <h3 id="summary-api-changes">API changes</h3> <p>None</p> <h3 id="summary-data-model-changes">Data model changes</h3> <p>None</p>