Отключить <select />, если есть только один <option /> с jQuery

Я разрабатываю бэкэнд для клиента, и у меня есть <select /> s, который работает вместе. В частности, у меня есть 3 <select /> для выбранной страны, провинции и города (для Испании), который работает и с другими странами.Отключить <select />, если есть только один <option /> с jQuery

Если выбранный вариант в стране - Испания, провинция будет заселена, и если выбран провинция, город будет заселен. Если в стране выбрана другая страна, провинция и город будут отключены без опции, но со значением по умолчанию <option value="0">-- Select--</option>.

Когда выбрана страна/провинция/город, выполняется транзакция ajax для получения результатов. Контроллер PHP анализ результатов, и если есть результаты (только для Испании) возвращает это (заполнить область):

<option value="0" >-- Select --</option> 
<option value="1" >Andalucía</option> 
<option value="2" >Aragón</option> 
<option value="3" >Asturias</option> 
...

Если нет никаких результатов для страны не выбраны, то контроллер возвращается:

<option value="0" >-- Select --</option>

Мой вопрос: как я могу это обработать, если есть ТОЛЬКО параметр со значением 0, добавьте attr («disabled», true); ?

Мой реальный код JavaScript:

$(document).ready(function(){ 
    $("select#codpais").change(function() { 
     var codpais = $(this).val(); 

     if (0 != codpais) { 
      $.post(BASE_URL + 'projects/ajax/get_autonomias', { codpais: codpais }, function(data) { 
       if (data) { 
        $("select#codauto").attr('disabled', false); 
        $("select#codauto").html(data); 
       } 
      }); 
     } 
    }); 
});

Проблема заключается в том, что контроллер всегда возвращает данные, потому что сайт является двуязычным, и некоторые пользователи должны видеть - Выберите - и другие - Seleccionar - - (если тоже отключено).

Спасибо заранее!

источник

2011-02-15 udexter

Похоже, вам просто нужно, чтобы проверить, есть только один вариант после того, как данные возвращаются затем отключить поле выбора, так что все, что вам нужно сделать, это найти длину элементов опции и отключить, если < = 1. Таким образом, в вашей функции $.post просто:

$.post(BASE_URL + 'projects/ajax/get_autonomias', { codpais: codpais }, function(data) { 
    if (data) { 
     var $sca = $("select#codauto"); 
     $sca.attr('disabled', false); 
     $sca.html(data); 
     if ($sca.find("option").length <= 1) { 
      $sca.attr('disabled', true); 
     } 
    } 
});

Я также добавил кеширование селектора для повышения производительности.

источник

2011-02-15 10:33:43 mVChr

спасибо. Лучше иметь селектор в var? – udexter

Каждый раз, когда вы делаете выбор, он требует циклов производительности, но если вы кешируете этот выбор в var, это не так. Поэтому, если вы вызываете один и тот же селектор несколько раз, вы должны сохранить его в var. – mVChr

Сделайте свой запрос AJAX возвратом некоторого JSON вместо необработанного HTML, в идеале.

В противном случае вы можете просмотреть $(data) с функциями обхода DOM, которые предоставляет jQuery, подсчитывая количество элементов. Если есть только один option, а его значение равно 0, установите disabled как true, а не false.

источник

2011-02-15 10:23:00

эй спасибо за ваш ответ.Я могу кодировать в json HTML? Поэтому я могу сделать массив вроде $ return = array ("return" => true, "html" => $ html_code); ? Заранее спасибо – udexter

@udexter: Вы можете, но это уродливо и полностью упускает суть. Кодируйте семантические данные, представляющие параметры в формате JSON, а затем создавайте HTML-код в своем Javascript при получении. Тогда вам будет намного легче решить, какой формат должен принимать HTML. –

Вы можете попробовать выбрать второй вариант, если его не существует, тогда вы можете его удалить. Вот пример, предупреждающий обо всех ситуациях.

Первый пример со многими вариантами: http://jsfiddle.net/zwKup/

Второй пример с опцией по умолчанию: http://jsfiddle.net/zwKup/1/

var checkSecond =$('select option:eq(1)').attr('value'); 
if (checkSecond == undefined) { 
    alert ('undefined here');} 
else {alert(checkSecond)}

источник

2011-02-15 10:27:05 Sotiris

$(document).ready(function(){ 
$("select#codpais").change(function() { 
    var codpais = $(this).val(); 

    if (0 != codpais) { 
     $.post(BASE_URL + 'projects/ajax/get_autonomias', { codpais: codpais }, function(data) { 
      $("select#codauto").html(data); 
      if (data.length == 0) { 
       $("select#codauto").attr('disabled', false); 

      }else{$("select#codauto").attr('disabled', true);} 
     }); 
    } 
});

});

источник

2011-02-15 10:34:12 Vasioky

Отключить <select />, если есть только один <option /> с jQuery

ответ

Смежные вопросы