Reset option select

Asked

Viewed 787 times

1

JS:

function alterarStatusFunction(val){
    if(val =="aprovado"){
        if (confirm('Tem certeza que deseja alterar o status dessa transação para APROVADO?')) {
            document.formtransacoes.submit();
        } else {
            return false;
        }
    }
}

HTML:

<select style="width:200px" onchange="alterarStatusFunction(this.options[this.selectedIndex].title);" name="alteraStatus">
    <option selected="selected" disabled="disabled">- Opções -</option>
    <option title="aprovado" value="aprovado">Marcar como APROVADO</option>
</select>

How can I make the option reset to the first option when the person clicks to cancel on Alert which is issued by the JS?

javascript html

2 answers

0


In which case you have the option disabled you can use the .selectedIndex = 0 thus:

const select = document.querySelector('select');
select.value = 'aprovado';

setTimeout(() => select.selectedIndex = 0, 2000);
<select style="width:200px" onchange="alterarStatusFunction(this.options[this.selectedIndex].title);" name="alteraStatus">
    <option selected="selected" disabled="disabled">- Opções -</option>
    <option title="aprovado" value="aprovado">Marcar como APROVADO</option>
</select>

<p>Daqui a 2 segundos será selecionado de novo a opção "disabled".</p>

Using your code would be like this:

function alterarStatusFunction(select) {
  var val = select.options[select.selectedIndex].title;
  if (val == "aprovado") {
    if (confirm('Tem certeza que deseja alterar o status dessa transação para APROVADO?')) {
      document.formtransacoes.submit();
    } else {
      return select.selectedIndex = 0;
    }
  }
}
<select style="width:200px" onchange="alterarStatusFunction(this);" name="alteraStatus">
    <option selected="selected" disabled="disabled">- Opções -</option>
    <option title="aprovado" value="aprovado">Marcar como APROVADO</option>
    <option title="desaprovado" value="desaprovado">Marcar como DESAPROVADO</option>
</select>

  • Actually I need it to change as soon as I click cancel on the confirmation Alert. When it displays the message "Are you sure you want..." the user can click ok and cancel. If you press OK it will trigger a form, if cancel does nothing and closes the message. Oh I need it re-reset the option.

  • @CEW joined an example with your code, passing the this to the function.

  • It worked, but it always stays in the first option, does not appear which was selected. In case it should return the first option only when click cancel.

  • @CEW in your code there is a Submit, if you open the console you will see that the browser calls Submit. I don’t know what you do later with Ubmit because it wasn’t part of the question/description of the problem

  • There is no relation to the form that is triggered, it is not the case. The form will be triggered only if you press ok in the confirmation dialog. What I need is to press CANCEL instead of OK in the dialog it switches to the first option of select. It should do this only when you click the button.

  • @CEW is what my code does, take a look at the second example.

Show 1 more comment

0

Just reference the select in the function, and use selectedIndex to restore. 

function alterarStatusFunction(val){
op = val.options[val.selectedIndex].title;
if(op == "aprovado"){
if (confirm('Tem certeza que deseja alterar o status dessa transação para APROVADO?')) {
document.formtransacoes.submit();
} else {
val.selectedIndex = 0; 
return false;
}
}
}
<select style="width:200px" onchange="alterarStatusFunction(this);" name="alteraStatus">
        <option selected="selected" disabled="disabled">- Opções -</option>
       <option title="aprovado" value="aprovado">Marcar como APROVADO</option>
      
    </select>

Browser other questions tagged javascript html

You are not signed in. Login or sign up in order to post.