Repository: jenkinsci/jenkins
File: war/src/main/webapp/scripts/hudson-behavior.js (JavaScript)

Code before:
        start = start.firstElementChild;
      } while (start && !isTR(start));

      if (start && !start.classList.contains("dropdownList-start")) {
        start = findFollowingTR(start, "dropdownList-start");
      }
      while (start != null) {
        subForms.push(start);
        start = findFollowingTR(start, "dropdownList-start");
      }

      // control visibility
      function updateDropDownList() {
        for (var i = 0; i < subForms.length; i++) {
          var show = e.selectedIndex == i;
          var f = subForms[i];

          if (show) {
            const idx = i; // capture the index so that it is not mutated in the loop
            renderOnDemand(f.nextElementSibling, function () {
              var current = e.selectedIndex == idx;
              if (!current) {
                console.log(
                  "**** renderOnDemandCallback, selection no longer valid, form submission would have been corrupted",
                );
                updateDropDownFormRowVisibility(f, false);
              }
            });
          }
          updateDropDownFormRowVisibility(f, show);
        }
      }

      function updateDropDownFormRowVisibility(f, show) {
        f.rowVisibilityGroup.makeInnerVisible(show);

        // TODO: this is actually incorrect in the general case if nested vg uses field-disabled
        // so far dropdownList doesn't create such a situation.
        f.rowVisibilityGroup.eachRow(
          true,
          show
            ? function (e) {
                e.removeAttribute("field-disabled");
              }
            : function (e) {
                e.setAttribute("field-disabled", "true");
              },
        );
      }

      e.onchange = updateDropDownList;

Review comment (bug):
Whilst I am confident this is the cause of the issue - this does not fix it (not sure why).

the entry is printed yet the form for username/password that should be disabled (as we have chosen `SSH Username with private key` remains like the following when debugged in `buildForm`  (  `console.log("BuildFormTree with form -> ", getHTML(form));`)


```
          <div width="100%" name="credentials" path="/credentials">
            <div class="dropdownList-start rowvg-start tr form-container--hidden" style="display: none;"
              field-disabled="true"></div>
            <div class="jenkins-form-item tr ">
```

this third div should have become:
```
             <div class="jenkins-form-item tr form-container--hidden" style="display: none;" field-disabled="true">
```

Code after:
        do {
          start = start.firstElementChild;
        } while (start && !isTR(start));

        if (start && !start.classList.contains("dropdownList-start")) {
          start = findFollowingTR(start, "dropdownList-start");
        }
        while (start != null) {
          subForms.push(start);
          start = findFollowingTR(start, "dropdownList-start");
        }
        return subForms;
      }

      var subForms = buildSubForms(e);
      // control visibility
      function updateDropDownList() {
        for (var i = 0; i < subForms.length; i++) {
          var show = e.selectedIndex == i;
          var f = subForms[i];

          if (show) {
            const idx = i; // capture the index so that it is not mutated in the loop
            renderOnDemand(f.nextElementSibling, function () {
              const current = e.selectedIndex == idx;
              if (!current) {
                console.warn(
                  "renderOnDemandCallback: selection is no longer valid, rebuilding correct DOM",
                );
                // our form div has changed (but the index is stable) so go and re-get the new domtree
                const subForm = buildSubForms(e)[idx];
                updateDropDownFormRowVisibility(subForm, false);
              }
            });
          }
          updateDropDownFormRowVisibility(f, show);
        }
      }

      function updateDropDownFormRowVisibility(f, show) {
        f.rowVisibilityGroup.makeInnerVisible(show);

        // TODO: this is actually incorrect in the general case if nested vg uses field-disabled
        // so far dropdownList doesn't create such a situation.
        f.rowVisibilityGroup.eachRow(
          true,
          show
            ? function (e) {
                e.removeAttribute("field-disabled");
              }
            : function (e) {