为了账号安全,请及时绑定邮箱和手机立即绑定

高亮CheckBoxList选中的项目

标签:
JavaScript


 

准备数据:

http://www.cnblogs.com/insus/articles/1439030.html

 

.aspx:

<asp:CheckBoxList ID="CheckBoxListColour" runat="server" RepeatColumns="10" RepeatDirection="Horizontal"
            OnDataBound="CheckBoxListColour_DataBound" OnSelectedIndexChanged="CheckBoxListColour_SelectedIndexChanged"
            AutoPostBack="true">
        </asp:CheckBoxList>

 

从上面的数据,下载并放入asp.net专案中,然后读出所有图片文件:

5acf07260001405b00110016.jpgView Code  private List<string> ImageNames
    {
        get
        {
            List<string> o = new List<string>();

            DirectoryInfo di = new DirectoryInfo(Server.MapPath ("~/Colours"));
            FileInfo[] fiArray = di.GetFiles();
            for (int i = 0; i < fiArray.Length; i++)
            {
                o.Add(fiArray[i].Name);
            }
            return o;
        }
    }

 

绑定数据至CheckBoxList控件:

5acf07260001405b00110016.jpgView Code  protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            Data_Binding();
        }
    }

    private void Data_Binding()
    {
        this.CheckBoxListColour.DataSource = ImageNames.Select(c => new { value = c }).ToList();
        this.CheckBoxListColour.DataTextField = "value";
        this.CheckBoxListColour.DataBind();
    }

 

 CheckBoxList控件的OnDataBound="CheckBoxListColour_DataBound"事件。

5acf07260001405b00110016.jpgView Code  protected void CheckBoxListColour_DataBound(object sender, EventArgs e)
    {
        var cbl = sender as CheckBoxList;
        foreach (ListItem li in cbl.Items)
        {
            li.Text = string.Format("<img src='Colours/{0}' />", li.Value);
        }
    }

 

CheckBoxList控件的OnSelectedIndexChanged="CheckBoxListColour_SelectedIndexChanged"事件。

5acf07260001405b00110016.jpgView Code protected void CheckBoxListColour_SelectedIndexChanged(object sender, EventArgs e)
    {
        var cbl = sender as CheckBoxList;
        foreach (ListItem li in cbl.Items)
        {
            if (li.Selected)
            {
                li.Attributes.Add("style", "background-color: red;");
            }
        }
    }

 

 

点击查看更多内容
TA 点赞

若觉得本文不错,就分享一下吧!

评论

作者其他优质文章

正在加载中
  • 推荐
  • 评论
  • 收藏
  • 共同学习,写下你的评论
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
今天注册有机会得

100积分直接送

付费专栏免费学

大额优惠券免费领

立即参与 放弃机会
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号

举报

0/150
提交
取消