Asp.net - 将图像字段添加到 gridview,并将其 link 添加到数据类型字段

Asp.net - Add imagefield to gridview, and link it to datatype field

我正在尝试将 "asp:Imagefield" 添加到我的网格视图中,以便它可以根据房间类型显示图像。假设我们的房间类型是:单人房、双人房和家庭房。基于这些,我也希望它显示图像。在我的图像文件夹中,我有这些图像:

Double.jpg
Single.jpg
Family.jpg

因此对于所有双行(其中 Type = "Double"),它应该显示 Double.jpg 图像。

现在我的 gridview 看起来像这样:

Nr    Type    Price    Select (checkbox)

我添加了图像字段,现在看起来像这样:

Photo   Nr   Type   Price    Select

一些代码:

 <!-- Source control -->
                <asp:SqlDataSource ID="SqlDataSource1" runat="server"   ConnectionString="<%$ ConnectionStrings:DefaultConnection %>"     SelectCommand="SELECT Nr, Type, Price
FROM AspRooms r
WHERE  @adults &lt;= r.Adult AND @children &lt;= r.Children AND NOT EXISTS
(
    SELECT 1 FROM Booking b
    WHERE b.RoomNr = r.Nr
    AND 
    (
         (CAST(@Checkin AS date) &gt;= b.CheckIn AND CAST(@Checkin AS date)  &lt;= b.CheckOut)
      OR (CAST(@Checkin AS date) &lt;= b.CheckIn AND CAST(@Checkout AS date) &gt;= b.CheckIn)
    )
)

">
                    <SelectParameters>                            
                        <asp:ControlParameter ControlID="adults"  Name="adults" PropertyName="SelectedValue" />
                        <asp:ControlParameter ControlID="childrens" Name="children" PropertyName="SelectedValue" />
                        <asp:ControlParameter ControlID="datetimepicker1" Name="Checkin" PropertyName="Text" />
                        <asp:ControlParameter ControlID="datetimepicker2" Name="Checkout" PropertyName="Text" />                           
                    </SelectParameters>
                </asp:SqlDataSource>
                <!-- Gridview table -->
                <asp:GridView ID="GridView1" runat="server" CssClass="table table-hover table-condensed" GridLines="None" AutoGenerateColumns="False"  DataKeyNames="Nr" DataSourceID="SqlDataSource1" Width="100%">
                    <Columns>
                        <asp:ImageField HeaderText="Rooms"   DataImageUrlField="PhotoPath" ControlStyle-Height="150px" ControlStyle-Width="150px">

                        </asp:ImageField>
                        <asp:BoundField DataField="Nr" HeaderText="Nr"  ReadOnly="True" SortExpression="Nr" />
                        <asp:BoundField DataField="Type" HeaderText="Type"  SortExpression="Type" />
                        <asp:BoundField DataField="Price" HeaderText="Price" SortExpression="Price" />

                        <asp:TemplateField HeaderText="Select Room">
                            <EditItemTemplate>
                                <asp:CheckBox ID="CheckBox1" runat="server" />
                            </EditItemTemplate>
                            <ItemTemplate>
                                <asp:CheckBox ID="CheckBox1" runat="server" />
                            </ItemTemplate>
                        </asp:TemplateField>                          
                    </Columns>
                </asp:GridView>

正如您在代码中看到的,我在 ImageField 中使用了 DataImageUrlField="PhotoPath"。在我的数据库中,我创建了一个名为 PhotoPath 的字段,其中包含数据类型 nchar(20)。表格是这样的:images/single.jpg

但是当这是 运行 时,我收到一个错误,其中显示:在所选数据源上找不到名称为 'PhotoPath' 的字段或 属性。

任何人都可以看到我的代码目前有什么问题吗?

您需要将 PhotoPath 列添加到 SelectCommand,并更新 ImageField 以使用该列。

由于您设置了 AutoGenerateColumns="False",此列不会自动显示为单独的列。

您还可以将重叠预订的测试简化为:

[my check in] <= [booking check out] 
AND 
[my check out] >= [booking check in]

这将查找与新预订重叠的任何现有预订。您当前的查询仅查找完全包含新预订或在新预订期间开始的预订。将找不到在新预订之前开始并在其中途结束的预订。

<asp:SqlDataSource ID="SqlDataSource1" runat="server"
    ConnectionString="<%$ ConnectionStrings:DefaultConnection %>"
    SelectCommand="SELECT Nr, Type, Price, PhotoPath
FROM AspRooms r
WHERE  @adults &lt;= r.Adult AND @children &lt;= r.Children AND NOT EXISTS
(
    SELECT 1 FROM Booking b
    WHERE b.RoomNr = r.Nr
    AND CAST(@Checkin AS date) &lt;= b.CheckOut
    AND CAST(@Checkout AS date) &gt;= b.CheckIn
)">
<SelectParameters>                            
    <asp:ControlParameter ControlID="adults"  Name="adults" PropertyName="SelectedValue" />
    <asp:ControlParameter ControlID="childrens" Name="children" PropertyName="SelectedValue" />
    <asp:ControlParameter ControlID="datetimepicker1" Name="Checkin" PropertyName="Text" />
    <asp:ControlParameter ControlID="datetimepicker2" Name="Checkout" PropertyName="Text" />                           
</SelectParameters>
</asp:SqlDataSource>


<asp:GridView ID="GridView1" runat="server" 
    DataSourceID="SqlDataSource1" DataKeyNames="Nr"
    CssClass="table table-hover table-condensed" GridLines="None" AutoGenerateColumns="False" Width="100%"
>
<Columns>
    <asp:ImageField HeaderText="Rooms"
        DataImageUrlField="PhotoPath" 
        ControlStyle-Height="150px" 
        ControlStyle-Width="150px"
    />
    <asp:BoundField DataField="Nr" HeaderText="Nr"  ReadOnly="True" SortExpression="Nr" />
    <asp:BoundField DataField="Type" HeaderText="Type"  SortExpression="Type" />
    <asp:BoundField DataField="Price" HeaderText="Price" SortExpression="Price" />

    <asp:TemplateField HeaderText="Select Room">
    <EditItemTemplate>
        <asp:CheckBox ID="CheckBox1" runat="server" />
    </EditItemTemplate>
    <ItemTemplate>
        <asp:CheckBox ID="CheckBox1" runat="server" />
    </ItemTemplate>
    </asp:TemplateField>                          
</Columns>
</asp:GridView>