在显示GridView中不同的图片取决于数据？ [英] Displaying different pictures in GridView depending on the data?

问题描述

我创造在VB.net在Visual Studio 2010中的Web报表。该报告需要显示表（请参阅附图片）。我想使用GridView控件组件，我认为这是最合适的选择。在数据库中有学生的数据和标志。我不能以任何方式更改数据库中，我必须使用Visual Studio 2010与VB。

I am creating a WEB report in Visual Studio 2010 in VB.net. The report needs to display a table (please see the attached image). I am thinking to use the GridView component which i think it's the most appropriate one to choose. In the database there are students' data and marks. I can't alter the database in any way and i have to use Visual Studio 2010 with VB.

我需要做的是显示3张不同的图片（例如）取决于学生的痕迹。我在PNG格式的图像文件，但这个可以flexible.For例如，70将是一个微笑的画​​面。 60将是正常的脸。而超过40将与没有笑容的照片。我咬我很难解释，但我希望u明白我的意思。

What i need to do is to show 3 different pictures(for example) depend on the student's marks. I got the pictures file in PNGs but this can be flexible.For example, over 70 will be a Smile picture. over 60 will be the Normal face. and over 40 will be the picture with no smile. I bit difficult for me to explain but i hope u get my point.

所以，请指点我如何才能做到这一点。我很是新手这个，你可以把PLS的细节。如果客户端和服务器端脚本之间进行选择，我preFER服务器端脚本。数据源可以是灵活（SQL或LINQ或任何东西）。

So pls advice me how can i achieve this. I am quite a newbie to this pls put as detail as you can. if there is a choice between client and server side script, i prefer server side script. Data source can be flexible (sql, or linq or anything).

推荐答案

您应该使用的的RowDataBound 将数据绑定到控件在你的GridView。

You should use RowDataBound to bind data to controls in your GridView.

以下是ASPX和codebehind（说多万字）一个完整的示例：

Following is a complete sample with aspx and codebehind(says more than thousand words):

<style type="text/css">
    .GridViewRowStyle
    {
        background-color: #A0CFEC;
        color:Blue;
    }
    .GridViewAlternatingRowStyle
    {
        background-color:White;
        color:#15317E;
    }
    .GridViewHeaderStyle
    {
        background-color:White;
        color:#15317E;
    }
</style>

<asp:GridView ID="GridStudents" AutoGenerateColumns="false" GridLines="None" runat="server">
    <RowStyle  CssClass="GridViewRowStyle" />
    <AlternatingRowStyle CssClass="GridViewAlternatingRowStyle" />
    <HeaderStyle CssClass="GridViewHeaderStyle" />
    <Columns>
        <asp:TemplateField HeaderText="Student">
           <ItemTemplate>
                <asp:label runat="server" ID="LblStudent" Text='<%# Bind("Student") %>'></asp:label>
            </ItemTemplate>
        </asp:TemplateField>
         <asp:TemplateField HeaderText="Mark">
           <ItemTemplate>
                <asp:label runat="server" ID="LblMark" Text='<%# Bind("Mark") %>'></asp:label>
            </ItemTemplate>
        </asp:TemplateField>
        <asp:TemplateField HeaderText="">
           <ItemTemplate>
                <asp:Image runat="server" ID="ImgSmiley" />
            </ItemTemplate>
        </asp:TemplateField>
    </Columns>
</asp:GridView>

codebehind（样本数据）：

Codebehind(with sample-data):

Private Sub GridStudents_RowDataBound(sender As Object, e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles GridStudents.RowDataBound
    Select Case e.Row.RowType
        Case DataControlRowType.DataRow
            Dim row = DirectCast(e.Row.DataItem, DataRowView)
            Dim ImgSmiley = DirectCast(e.Row.FindControl("ImgSmiley"), Image)
            Select Case DirectCast(row("Mark"), Int32)
                Case Is < 50
                    ImgSmiley.ImageUrl = "~/Images/Smiley_Grim.png"
                    ImgSmiley.ToolTip = "bad"
                Case Is < 70
                    ImgSmiley.ImageUrl = "~/Images/Smiley_Def.png"
                    ImgSmiley.ToolTip = "ok"
                Case Else
                    ImgSmiley.ImageUrl = "~/Images/Smiley_Laugh.png"
                    ImgSmiley.ToolTip = "fine"
            End Select
    End Select
End Sub

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
    If Not IsPostBack Then
        BindData()
    End If
End Sub

Private Sub BindData()
    Dim tblStudent As New DataTable("Students")
    Dim colStudent = New DataColumn("Student", GetType(String))
    Dim colMark As New DataColumn("Mark", GetType(Int32))
    tblStudent.Columns.Add(colStudent)
    tblStudent.Columns.Add(colMark)

    Dim newRow = tblStudent.NewRow
    newRow("Student") = "Tom"
    newRow("Mark") = 70
    tblStudent.Rows.Add(newRow)
    newRow = tblStudent.NewRow
    newRow("Student") = "Bob"
    newRow("Mark") = 40
    tblStudent.Rows.Add(newRow)
    newRow = tblStudent.NewRow
    newRow("Student") = "Danny"
    newRow("Mark") = 60
    tblStudent.Rows.Add(newRow)
    newRow = tblStudent.NewRow
    newRow("Student") = "Sussie"
    newRow("Mark") = 40
    tblStudent.Rows.Add(newRow)

    GridStudents.DataSource = tblStudent
    GridStudents.DataBind()
End Sub

这篇关于在显示GridView中不同的图片取决于数据？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！