2011-04-28 49 views
0

我已经创建了一个房地产搜索功能,用户将在其中输入价格范围。我已经选择了两个字段来最大限度地减少用户错误,一个用于最低价格,另一个用于最高价格。我想利用动态表单来进一步减少输入错误。什么是动态值范围选择表格的最佳方法?

例如,最低价格选择具有以下值:

  • $ 100K(默认)
  • $ 200K
  • $ 300K
  • $ 400K
  • $ 500K
  • $ 600k
  • $ 700k
  • $ 80万
  • $ 900K
  • $ 1M

虽然最高价格选择具有与上面相同,但没有$ 100K,用另外的$ 2M +,拥有20万$的默认值。

我想要实现的功能是,不仅可以验证页面上的条目,还可以动态更改最高价格的选择选项。因此,当用户选择最低价格时,最高价格字段选项将不会显示所选最低价格及以下。

所以在开始时,如果用户选择最低$ 500k,最大值会自动变为$ 600k,同时从选项中删除任何值。

这是最好的方法是什么?

在此先感谢!


更新: 我跟着杰克的回答,我不能使它发挥作用。

这里的形式和脚本代码:

<form name="search" action="/search/" method="get"> 
<label>Price Range: </label> 
Between: 
<select name="min_price"> 
<option value="1">1M</option> 
<option value="2">2M</option> 
... 
<option value="15">15M</option> 
<option value="20">20M</option> 
</select> 
and 
<select name="max_price"> 
<option value="2">2M</option> 
<option value="3">3M</option> 
... 
<option value="30">30M+</option> 
</select> 
... 
</form> 

<script type="text/javascript"> 
$("#min_price").change(function(){ 
    var min = $(this).val(); 
    $("#max_price").find("option").each(function(){ 
     if (this.value <= min) { 
      $(this).hide(); 
     } 
     else { 
      $(this).show(); 
     } 
    }); 
}); 
</script> 

我使用WordPress和它的jQuery 1.4.4。我怎样才能使它工作?我的html代码有错误吗?

+0

添加ID attributtes到ID = “MIN_PRICE” 和id = “MAX_PRICE” 到 ... – 2011-04-28 18:12:05

+0

感谢您的支持!我知道这是正确的,但我认为在我的代码的某处存在冲突,jQuery表单函数不能正常工作。如果你不介意,你可以看看我的[网站](http://www.mycondophilippines.com)。 – iamebet 2011-04-29 01:39:10

相关问题