setValue setting attribute to undefined react hook form

Question

Im using react-hook-form in my project i want to assign one field to be pre filled on some condition but set value not working properly although it validation properly but not setting the value here is my form field

<div className="item-input hal-input hal-margin-bottom-0 item-input-field not-empty-state">
  <select
    disabled={
      activeStep === 2 || activeStep === 3 || dataForDropdown?.length == 1
    }
    {...register("issuerAccount", {
      required: true,
    })}
    onChange={(e) => setNickname(e)}
    className="hal-input-select account-selector "
    data-type="account"
  >
    <option value="">- Select -</option>
    {dataForDropdown?.map((x, i) => (
      <option value={x.id} selected={dataForDropdown?.length == 1}>
        {x.id}
      </option>
    ))}
  </select>
  {errors.issuerAccount && (
    <span className="hal-validation_errors creditorAccount">
      {literals("newSubscription.field.requiredText")}
    </span>
  )}
</div>;

here is data

useEffect(() => {
  if (issuer)
    setDataForDropdown(
      issuer.accounts.map((x) => ({
        id: x.accountNumber,
        text: x.branchName,
        selected: true,
      }))
    );

  if (issuer && issuer.accounts.length == 1) {
    console.log(issuer.accounts[0].accountNumber);
    setValue("issuerAccount", issuer.accounts[0].accountNumber);
  }
}, [issuer]);

i want to set issuerAccount field but I get the undefined on form submission

Answer 1

so the problems was I had disabled the select element thats why it was saving undefined on form object.