user2805474
user2805474

Reputation: 1

Disabling a select from another select in jQuery Mobile

I am developing an application in jQuery Mobile and in a form I have the following select

<label for="estado_toma">Estado de la Toma</label>
<select id="estado_toma" name="estado_toma" data-native-menu="false">
    <option data-placeholder="true">Estado de la Toma</option>
    <option value="1">Buen Estado</option>
    <option value="2">Caja Dañada</option>
    <option value="3">Sin Tapa</option>
    <option value="4">No Hay</option>
</select>

I want to do that when you choose the no option other select disable me that are below this and when you choose the other options become available those other select.

  Greatly appreciate the help they can give me,

  regards.

Upvotes: 0

Views: 111

Answers (2)

Omar
Omar

Reputation: 31732

To disable a selectmenu:

$(".selector").selectmenu("disbale");

To enable a selectmenu:

$(".selector").selectmenu("enable");

Listen to change event:

$("#estado_toma").on("change", function () {
  var sel_val = $(this).val();
  if (sel_val == 4) {
    $("#otros").selectmenu("disable");
  } else {
    $("#otros").selectmenu("enable");
  }
});

Demo

Upvotes: 1

jaredrada
jaredrada

Reputation: 1150

Youll need to bind a change event, so something like this:

$('body').on('#estado_toma', 'change', function(){
    if($(this).val() === '4') {
        $('your-other-select').attr('disabled','disabled');
    }
});

Upvotes: 0

Related Questions