2012-08-02 2 views
0

У меня есть два drop downs, а именно Min Price и Max Price, я хочу изменить второе раскрывающееся значение на основе первого выбора.Как изменить второе раскрывающееся значение на основе первого раскрывающегося списка?

Say пример 1st drop-down selection is 100 means, 2nd drop-down value should be greater than the 100, if it is 200 in 1st, value of 2nd should be greater than 200

Любая идея в JQuery или JS?

+0

Привет Рикки я не знаю, как это сделать, пожалуйста, руководство меня –

+1

Я спросил, что, поскольку считается хорошей практикой показать, что вы что-то пробовали, прежде чем просить о помощи, иначе это звучит так, как будто вы просите кого-то сделать домашнее задание ... Но поскольку это такой популярный вопрос Я предполагаю, что у вас есть 5 реализаций ready =) выбрать один;) – ricardoespsanto

ответ

7

Простейшее я мог думать (это позволит вам вернуться в ваш выбор, вы можете выбрать 400, а затем 200 и все работает)

<select id='min'> 
<option value='100'>100</option> 
<option value='200'>200</option> 
<option value='300'>300</option> 
<option value='400'>400</option> 
</select> 
<select id='max'> 
<option value='100'>100</option> 
<option value='200'>200</option> 
<option value='300'>300</option> 
<option value='400'>400</option> 
</select>​ 

var removed; 

$('#min').change(function() { 
    var value = this.value; 
    $('#max').prepend(removed); 
    var toKeep = $('#max option').filter(function() { 
     return parseInt(this.value, 10) >= parseInt(value, 10); 
    }); 
    removed = $('#max option').filter(function() { 
     return parseInt(this.value, 10) < parseInt(value, 10); 
    }); 
    $('#max').html(toKeep); 
});​ 

http://jsfiddle.net/NjLNF/2/

РЕДАКТИРОВАТЬ - добавил ParseInt(), как за комментарий

+0

привет его рабочий штраф до 100 до 900, после этого (1000,2000, ..) его не работает должным образом проверьте это [http://jsfiddle.net/NjLNF/1/](http://jsfiddle.net/NjLNF/1 /) –

+0

@LearneR да, вы правы, потому что вам нужно parseInt() значения http://jsfiddle.net/NjLNF/2/ –

0
$('#first_dd').change(function(){ 
var dd_val=$(this).val(); 
var options = ""; 
$('#second_dd').html(''); 
for(var i=parseInt(dd_val+1);i<=END-LIMIT;i++) 
{ 
$('#second_dd').append('<option value='+i+'>'+i+'</option>'); 
} 
}); 

Я не тестировал его в браузере. Рассмотрим систекс, просто следуйте логике.

+0

Да, но что, если пользователь выберет высокое значение для первого раскрывающегося списка, а затем запустит свой ум и хочет получить более низкий? –

0
$(function() { 
     $("#one").change(function (e) { 
      $("#two").empty(); 

      var options = 
      $("#one option").filter(function(e){ 
       return $(this).attr("value") > $("#one option:selected").val(); 
      }).clone(); 

      $("#two").append(options); 
     }); 
    }); 
+0

И если вы хотите вернуться? Я имею в виду, если вы сначала выберите 4 в первый выпадающий, а затем один? –

+0

Скрипт не меняет (влияет на) значения раскрывающегося списка '# one', просто клонируя значения больше, чем' # one', чтобы '# two' – Kalpesh

1

Вы можете использовать функцию jquery и функцию изменения. Если вы выбрали id для первого выпадающего списка drop1, это будет $ ("# drop1"). Change (function() {.. поместите здесь свою функцию, чтобы заполнить вторую выпадающую ссылку.

0

Добавить слушателя в Min Цена выпадающий затем перебрать значения Max Цена выпадающие до вас найти значение больше, чем выбранное Минимальная цена в раскрывающемся списке. Что-то вроде этого

$('#minPrice').change(function(){ 
    var minVal = $('#minPrice option:selected').val(); 
    $('#maxPrice option').each(function(){ 
      if(minVal < $(this).val()){ 
      $(this).attr('selected', 'selected'); 
      return false; 
      } 
    }); 
}); 
Смежные вопросы

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