类似京东筛选商品效果

[qiqishardgel]

我想要实现的是类似京东筛选商品属性的效果，我现在做到的如下图：

当我点击品牌时，点击的这一项到了已选条件中，现在问题是我在点击其他属性时，就会把已选条件中的品牌这一选项替代，但我想要的是，在点击其他属性，比如价格，那价格就会排到已选条件品牌的后面，品牌在前面保持不变，请问要怎么实现？

protected void DataList2_ItemCommand(object source, DataListCommandEventArgs e)
    {
        int cs_id = Convert.ToInt32(e.CommandArgument);
        if (e.CommandName == "go")
        {
            Panel1.Visible = true;
            List<Comgezi_ShuxingInfo> list1 = new List<Comgezi_ShuxingInfo>();
            List<Comgezi_ShuxingInfo> list2 = Comgezi_ShuxingBiz.SelectListByCsId(cs_id);
            foreach (Comgezi_ShuxingInfo com in list2)
            {
                Comgezi_ShuxingInfo shuxing = Comgezi_ShuxingBiz.SelectByCsId(com.Parent_id);
                list1.Add(shuxing);
            }
            DataList3.DataSource = list1;
            DataList3.DataBind();
            for (int i = 0; i < DataList3.Items.Count; i++)
            {
                LinkButton lbtn = (LinkButton)DataList3.Items[i].FindControl("LinkButton2");
                Comgezi_ShuxingInfo name = Comgezi_ShuxingBiz.SelectByCsId(cs_id);
                lbtn.Text = name.Cs_name;
            }
        }
    }

DataList2是绑定的是所有属性，当点击某个属性后就绑定到DataList3显示

[qiqishardgel]

这个是用ArrayList来实现吗，是的话要怎么做呢，以前没有弄过，请指教！

[qiqishardgel]

自己顶！！！

[骑猪看海]

前台用JS直接拼出URL条件,这类示例网上很多吧

[yyl8781697]

可以用传递URL来控制显示已选项和具体的SQL拼接 比如品牌的每一项Id为Bi 尺寸的每一项Id为Si 价格的每一项的Id为Pi 你页面的参数形式为s=b1-p2 表示选择了联想和6000-8999的价格， 假如我此时点击三星(SumSung)，则用javascript判断当前已选项中的b前缀的项，发现已经有b1了，则替换成b2 ，再进行URL跳转，此时页面传值为s=b2-p2 这样应该比较容易实现吧

[Im_Sorry]

找点这个特效，修改下结合前端技术就可以搞定！

[qiqishardgel]

再顶一下！！！

[qiqishardgel]

引用 5 楼 yyl8781697 的回复:

可以用传递URL来控制显示已选项和具体的SQL拼接 比如品牌的每一项Id为Bi 尺寸的每一项Id为Si 价格的每一项的Id为Pi 你页面的参数形式为s=b1-p2 表示选择了联想和6000-8999的价格， 假如我此时点击三星(SumSung)，则用javascript判断当前已选项中的b前缀的项，发现已经有b1了，则替换成b2 ，再进行URL跳转，此时页面传值为s=b2-p2 这样应该比较容易实现吧

但是我那些品牌，尺寸，价格都不是固定的，每个类下的属性都不一样，这要怎么弄，要所有的属性都定义一下吗？

[H_Gragon]

这不就是Sql语句拼接嘛！

[娃都会打酱油了]

这种东西明显用ajax才友好，不管你是通过ajax插件，还是自己手写js 思路非常简单，如果用Jquery的话 假定上面显示的是sp_Title 下面的所有超链接选项都有一个自定义attr比如品牌哪里就有 t="品牌"，选定项都有一个特定的class比如.selected 那么最终js就是

var h='';
var sels = $('a.selected');
for(var i=0;i<sels.length;i++)
{
   h+= $(sels[i]).attr('t')+':'+$(sels[i]).text();
}
$('#sp_Title').html(h);

多么简单的事情。。。 顺便说下我不喜欢用each....所以请不要吐槽为啥要自己写for循环。。。

[yyl8781697]

引用 7 楼 qiqishardgel 的回复:

[quote=引用 5 楼 yyl8781697 的回复:] 可以用传递URL来控制显示已选项和具体的SQL拼接 比如品牌的每一项Id为Bi 尺寸的每一项Id为Si 价格的每一项的Id为Pi 你页面的参数形式为s=b1-p2 表示选择了联想和6000-8999的价格， 假如我此时点击三星(SumSung)，则用javascript判断当前已选项中的b前缀的项，发现已经有b1了，则替换成b2 ，再进行URL跳转，此时页面传值为s=b2-p2 这样应该比较容易实现吧

但是我那些品牌，尺寸，价格都不是固定的，每个类下的属性都不一样，这要怎么弄，要所有的属性都定义一下吗？[/quote] 这里当然是为不固定设计的， b2,p2之类的这类Id只是对应你页面上的筛选项的Id而已（生成的时候也是自己按照规律生成的），对应之后取得其对应的值 再用该值去进行数据库查许护