How to reset a selection menu (selectmenu) when changing another field using a function?

Question

How to reset a selection menu (selectmenu) when changing another field using a function?

Navigation

#1 by (3 votes)
#2 by (0 votes)

1

I'm trying to make a "select menu" ( selectmenu ) be reset when I enter a value by hand in a text field, but although I've tried countless solutions that I researched right here in Stack Overflow and other sites, none worked.

Below is my HTML code:

<div>
 <label>Selecione Um Prazo Padrão:</label>
</div>
<div>
  <select name="menuPrazo" id="menuPrazo" class="menuPrazo">
    <option value="*" selected="selected">Escolha um Tipo de Prazo</option>
    <option value="1">A Vista</option>
    <option value="30">Prazo Normal</option>
    <option value="15">Prazo Estendido</option>
</select>
</div>
<div>
<label>Ou Informe Um Prazo Personalizado:</label>
</div>
<div>
<input type="text" name="prazoManual" id="prazoManual" class="prazoManual" value=""></input>
</div>

Below the JavaScript code:

$(".menuPrazo").on("change", function () {
    $("#prazoManual").val("");
});

$(".prazoManual").on("change", function () {
  $('#menuPrazo').prop('selectedIndex',0);  
});

In addition to the option contained in the code above, I've tried the following options:

$("select#menuPrazo").selectmenu("index", 0);

or

$("#menuPrazo").val("");

or

$("#menuPrazo").refresh();

JSFiddle

javascript jquery

asked by anonymous 20.08.2014 / 04:03

2 answers

Fields validation failed System.ArgumentException when using MySQL with Entity framework

score 3 · Answer 1

3

You forgot the ".change ()" when changing

    $("#prazoManual").on("change", function () {
      $('#menuPrazo').val('*').change();
    });

20.08.2014 / 23:51

score 0 · Answer 2

With the change event on both of them looks like this:

<script src="js/js_1.9/jquery-1.8.2.js" type="text/javascript"></script>        
<div>
 <label>Selecione Um Prazo Padrão:</label>
</div>
<div>
  <select name="menuPrazo" id="menuPrazo" class="menuPrazo">
    <option value="*" selected="selected">Escolha um Tipo de Prazo</option>
    <option value="1">A Vista</option>
    <option value="30">Prazo Normal</option>
    <option value="15">Prazo Estendido</option>
</select>
</div>
<div>
<label>Ou Informe Um Prazo Personalizado:</label>
</div>
<div>
<input type="text" name="prazoManual" id="prazoManual" class="prazoManual" value=""></input>
</div>

<script>
    $(".menuPrazo").on("change", function () {
        $("#prazoManual").val("");
    });

    $(".prazoManual").on("change", function () {
        $('#menuPrazo option:eq(0)').attr('selected','selected');  
    });
</script>

Of course the correct thing is to create a button to "reset" and in this button you implement the event click on made your change there.