asp.net 实现非下拉列表筛选数据的功能

Question

效果如下：
装修用途：不限　二房　三房　别墅
装修预算：不限　５万　10万  30万
装修程度：不限  简单  精装  高档  豪华点击某项后，颜色突出显示，并筛选数据

Answer 1

你先中一个选项后, 要筛选数据, 如果不是ajax取数据, 一般是需要跳转到新页面吧, 在新页面加颜色突出效果就是了.

Answer 2

ajax获取 根据选择的编号到数据库查询一次

Answer 3

呵呵 这个 就是按钮点击啊 无刷新 链接点击的时候拼接where 条件就好了比如一开始的SQL是string sql="select * from table where 1=1";点击一个sql+=" and xxx='"+点击的条件+"' "传入查询 AJAX。

Answer 4

问题补充：（.aspx页面javascript及数据绑定）
<script type="text/javascript">
$(document).ready(function(){
//设置高亮
$.each($('.search li'), function(){
var value = $(this).attr('text');
var obj = $(this);
$.each($(this).find('a'), function() {
if ($(this).text() == value) {
obj.find('a:first').removeClass('selected');
$(this).addClass('selected');
return;
}
});
});
//
$('.search a').click(function(){
$.each($(this).parent('li').find('a'), function(){
$(this).removeClass('selected');
});

$.each($(this).parent('div').find('a'), function(){
$(this).removeClass('selected');
});

$(this).addClass('selected');
//拼接url
var url = '?';
$.each($('.search li'), function(){
var id = $(this).attr('id');
var text = $.trim($(this).find('.selected').text());
if (text != '不限' && text != '') {
url += '&' + id + '=' + text; 
}
});
window.location.href = url;
return false;
});
//
});
</script>
<ul class="search">
                <li id="unit" title="">
                    装修用途：<a href="javascript:void(0);" class="selected" title="0">不限</a>
                    <asp:Repeater ID="Repeater9" runat="server">
                        <ItemTemplate>
                            <a href="javascript:void(0);" title='<%# DataBinder.Eval(Container.DataItem,"Id") %>'>
                                <asp:Label ID="Label1" runat="server" Text='<%# DataBinder.Eval(Container.DataItem,"Purpose") %>'></asp:Label></a>
                        </ItemTemplate>
                    </asp:Repeater>
                </li>
                <li class="line" id="budget" title="">
                    装修预算：<a href="javascript:void(0);" class="selected" title="0">不限</a>
                    <asp:Repeater ID="Repeater10" runat="server">
                        <ItemTemplate>
                            <a href="javascript:void(0);" title='<%# DataBinder.Eval(Container.DataItem,"Id") %>'>
                                <asp:Label ID="Label2" runat="server" Text='<%# DataBinder.Eval(Container.DataItem,"Budget") %>'></asp:Label>
                                
                                </a>
                        </ItemTemplate>
                    </asp:Repeater>
                </li>
                <li id="zxfs" class="line" title="">
                    装修方式：<a href="javascript:void(0);" class="selected" title='0'>不限</a>
                    <a href="javascript:void(0);" title='1'>半包</a>
            <a href="javascript:void(0);" title='2'>全包</a>
            <a href="javascript:void(0);" title='3'>纯设计</a>
                </li>
                <li id="Level" class="line" title="">
                    装修程度：<a href="javascript:void(0);" class="selected" title='0'>不限</a>
            <a href="javascript:void(0);" title='1'>简装</a>
            <a href="javascript:void(0);" title='2'>精装</a>
            <a href="javascript:void(0);" title='3'>高档</a>
            <a href="javascript:void(0);" title='4'>豪华</a>
                </li>
                <li id="area" style="height:54px; border:none;" title="">
                    <span class="f_l">区&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;域：</span>
                    <div class="area-list">
                        <a href="javascript:void(0);" class="selected" title='0'>不限</a>
                        <asp:Repeater ID="Repeater11" runat="server">
                            <ItemTemplate>
                                <a href="javascript:void(0);" title='<%# DataBinder.Eval(Container.DataItem,"Id") %>'>
                                    <asp:Label ID="Label3" runat="server" Text='<%# DataBinder.Eval(Container.DataItem,"Area1") %>'></asp:Label></a>
                            </ItemTemplate>
                        </asp:Repeater>
                    </div>
                </li>
            </ul> 本来想用拼接url的方式，获取选中的参数，可每次回发的时候都只能获取一个参数