change submit button name based on selected dropdown list

Question

How to change the button's name based on the selected values? This function I found returns null.

function myFunction(new_id) {
  if (new_id == 0) {
    return;
  }
  document.getElementById("submit").id = new_id;

  // test new id
  // remove this after testing
  alert(document.getElementById(new_id).id);
}

<select id="select" name="select" class="btn btn-block gray dropdown-toggle" required onchange="myFunction(this.value)">
  <option Disabled value="0" selected="selected">- Select Me -</option>
  <option value="5"> 5</option>
  <option value="10"> 10</option>
</select>
<button type="submit" id="submit" name="">Button</button><br>

Wouldn't it make more sense to change the button's value rather than its name? — Barmar
– Barmar, Commented Sep 4, 2020 at 21:19

Barmar · Accepted Answer · 2020-09-04 21:18:53Z

1

You shouldn't be changing the button's ID, you should change its name.

function myFunction(new_id) {
  if (new_id == 0) {
    return;
  }
  document.getElementById("submit").name = new_id;
  alert(document.getElementById("submit").name);
}

<select id="select" name="select" class="btn btn-block gray dropdown-toggle" required onchange="myFunction(this.value)">
  <option Disabled value="0" selected="selected">- Select Me -</option>
  <option value="5"> 5</option>
  <option value="10"> 10</option>
</select>
<button type="submit" id="submit" name="">Button</button><br>

However, changing the submit button's name seems like a poor design. I think it would be better to change its value.

answered Sep 4, 2020 at 21:18

Barmar

789k57 gold badges555 silver badges669 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Mohamed Abdel Fattah Over a year ago

this works for me .. and yeah value is not working with post to another php name define only works

Collectives™ on Stack Overflow

change submit button name based on selected dropdown list

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related