使用日期将下拉列表筛选为下拉列表
Filtering Dropdown to Dropdown using date
使用洋葱和wewe的过滤器下拉列表正在工作,但是当我更改为日期格式时,过滤器不起作用。我想知道如何解决这个问题。
这是我的 HTML 代码
<div>
<select ID="DropDownList1" Height="72px" Width="184px">
<option Value="111/111">All</option>
<option Value="">2013-10-10</option>
<option Value="">2013-10-09</option>
<option Value="">Onion</option>
<option Value="">Wewe</option>
</select>
<br />
<select ID="DropDownList2" Height="18px" Width="187px">
<option Value="2013-10-10">2013-10-10 Style 1</option>
<option Value="2013-10-10">2013-10-10 Style 2</option>
<option Value="2013-10-10">2013-10-10 Style 3</option>
<option Value="2013-10-09">2013-10-09 Style 1</option>
<option Value="2013-10-09">2013-10-09 Style 2</option>
<option Value="2013-10-09">2013-10-09 Style 3</option>
<option Value="Orange">Orange Style 4</option>
<option Value="Onion">Onion Style 1</option>
<option Value="Onion">Onion Style 2</option>
<option Value="Wewe">wewe Style 2</option>
</select>
</div>
和 Javascript
var options = $("#DropDownList2").html();
$("#DropDownList1").change(function(e) {
var text = $("#DropDownList1 :selected").text();
$("#DropDownList2").html(options);
if (text == "All") return;
$('#DropDownList2 :not([value^="' + text.substr(0, 3) + '"])').remove();
});
请帮忙谢谢:)
<select name="select1" id="select1">
<option Value="">All</option>
<option Value="2013-10-10">2013-10-10</option>
<option Value="2013-10-09">2013-10-09</option>
<option Value="Onion">Onion</option>
<option Value="Wewe">Wewe</option>
</select>
<select name="select2" id="select2">
<option Value="2013-10-10">2013-10-10 Style 1</option>
<option Value="2013-10-10">2013-10-10 Style 2</option>
<option Value="2013-10-10">2013-10-10 Style 3</option>
<option Value="2013-10-09">2013-10-09 Style 1</option>
<option Value="2013-10-09">2013-10-09 Style 2</option>
<option Value="2013-10-09">2013-10-09 Style 3</option>
<option Value="Orange">Orange Style 4</option>
<option Value="Onion">Onion Style 1</option>
<option Value="Onion">Onion Style 2</option>
<option Value="Wewe">wewe Style 2</option>
</select>
.JS
$("#select1").change(function() {
if($(this).data('options') == undefined){
/*Taking an array of all options-2 and kind of embedding it on the select1*/
$(this).data('options',$('#select2 option').clone());
}
var id = $(this).val();
var options = $(this).data('options').filter('[value=' + id + ']');
$('#select2').html(options);
});
演示
获取第一个选项的长度,然后更改代码,如下所示。var 期权 = $("#DropDownList2"(.html((;
$("#DropDownList1").change(function(e) {
var text = $("#DropDownList1 :selected").text();
var len = text.length;
$("#DropDownList2").html(options);
if (text == "All") return;
$('#DropDownList2 :not([value^="' + text.substr(0, len) + '"])').remove();
});
相关文章:
- 如何使用jQuery选择下拉列表的值
- 将jsp文件下拉列表中的选定项分配给一个java变量(比如String selection)
- Javascript按钮下拉列表
- jQuery表单添加不适用于下拉列表
- 用每小时的差值填充数组/列表-从下拉列表中给定两个时间值
- 使用下拉列表筛选列表(ul>li)
- 如何根据其他下拉列表中的选择筛选下拉结果
- Dojo 筛选选择 - 动态将下拉列表中的特定选项标记为禁用(灰显且不可选择)
- 单个列筛选不保存下拉列表 jQuery 的状态
- 根据下拉列表中所选值的其他属性筛选本地剑道数据源
- 使用日期将所有下拉列表筛选为下拉列表
- 使用日期将下拉列表筛选为下拉列表
- 选择另一个下拉列表时,Meteor 会动态筛选下拉列表
- 如何在填充选择下拉列表中添加搜索筛选器
- 基于从下拉列表中选择的值的筛选列表不起作用
- 甚至在选择下拉列表中使用.change来筛选结果
- jqgrid的外部筛选器下拉列表
- JAVASCRIPT/JQUERY-筛选选项(从下拉列表中选择1个值)
- 如何根据已预选列表上的文本筛选下拉列表
- 下拉列表以筛选特定列上的行