FormView布局

Question

在过去，这让我疯狂了好几次，但我总是捏造它，然后继续前进。今天我想试着修好它！

我经常创建一个GridView来显示数据，在插入模式下直接创建一个FormView，其中InsertItemTemplate中的控件对应于GridView中的列，因此看起来FormView只是等待新数据输入的GridView的空行。这个很好用。

问题是，我永远无法得到FormView中的“列”的宽度(实际上只是文本框)来对应于上面GridView中的列的宽度。

在下面的示例中，如您所见，GridView和FormView的宽度都是100%，当然，在呈现页面时，它们都是完全相同的宽度(我给了FormView一个简单的边框来检查)。然而，即使FormView中文本框的宽度与GridView中的列的宽度相同，它们也不会以这种方式显示。文本框稍微宽一些，当您到达最右边的列时，累积效应意味着对齐方式已经过时了。

我猜想这个问题与边框宽度或正在呈现的其他隐藏元素有关，但我无法弄清楚。我不得不说，对齐的数量似乎比边界上的几个像素对事物的影响更大。

<asp:GridView ID="gvTPR" runat="server" DataSourceID="SQLTPR" AutoGenerateColumns="false" DataMember="DefaultView" DataKeyNames="TPRID" Width="100%" >
<RowStyle HorizontalAlign="Center" />
<EditRowStyle BackColor="#ccffff" />
<HeaderStyle BackColor="#013b82" ForeColor="White" />
<Columns>
<asp:BoundField DataField="TPREnteredAt" HeaderText="Entered At" ReadOnly="True" SortExpression="TPREnteredAt" ItemStyle-Width="24%" ControlStyle-Width="90%" />
<asp:BoundField DataField="TPRTemp" HeaderText="Temp" ReadOnly="True" SortExpression="TPRTemp" ItemStyle-Width="12%" ControlStyle-Width="90%"/>
<asp:BoundField DataField="TPRPulse" HeaderText="Pulse" ReadOnly="True" SortExpression="TPRPulse" ItemStyle-Width="12%" ControlStyle-Width="90%"/>
<asp:BoundField DataField="TPRRespiration" HeaderText="Respiration" ReadOnly="True" SortExpression="TPRRespiration" ItemStyle-Width="12%" ControlStyle-Width="90%"/>
<asp:BoundField DataField="TPRPCV" HeaderText="PCV" ItemStyle-Width="12%" ControlStyle-Width="90%"/>
<asp:BoundField DataField="TPRTP" HeaderText="TP" ItemStyle-Width="12%" ControlStyle-Width="90%" />
<asp:CommandField ButtonType="Button" InsertVisible="False" ShowEditButton="True" ItemStyle-Width="16%" UpdateText="Save" ControlStyle-Width="60px" />
</Columns>
<EmptyDataTemplate>
No TPR records exist
</EmptyDataTemplate>
</asp:GridView>
<asp:FormView ID="fvTPR" runat="server" DataSourceID="SQLTPR" DefaultMode="Insert" Width="100%" >
<InsertItemTemplate>
<asp:textbox ID="lblEnteredAt" runat="server" Text="Will be added automatically" Width="24%" />
<asp:TextBox ID="txtTemp" runat="server" Text='<%# Bind("TPRTemp")%>' Width="12%" />
<asp:TextBox ID="txtPulse" runat="server" Text='<%# Bind("TPRPulse")%>' Width="12%" />
<asp:TextBox ID="txtRespiration" runat="server" Text='<%# Bind("TPRRespiration")%>' Width="12%" />
<asp:TextBox ID="txtPCV" runat="server" Text='<%# Bind("TPRPCV")%>' Width="12%" />
<asp:TextBox ID="txtTP" runat="server" Text='<%# Bind("TPRTP")%>' Width="12%" />                
<asp:Button ID="btnAddTPR" runat="server" Text="Save" Width="5%" />
</InsertItemTemplate>
</asp:FormView>

如下所示：

​

Answer 1

使用GridView页脚添加趣味性如何？这样，您将在同一表中的所有列，您将绕过您的定位问题。

下面是你的网格视图应该是什么样子的一个例子：

<asp:GridView ID="gvTPR" runat="server" DataSourceID="SQLTPR" AutoGenerateColumns="False" ShowFooter="True" DataKeyNames="TPRID" Width="100%" EnableModelValidation="True">
<RowStyle HorizontalAlign="Center" />
<EditRowStyle BackColor="#ccffff" />
<HeaderStyle BackColor="#013b82" ForeColor="White" />
<Columns>
    <asp:TemplateField HeaderText="Entered At" SortExpression="TPREnteredAt">
        <EditItemTemplate>
            <asp:TextBox ID="lblEnteredAt" runat="server" Text='<%# Eval("TPREnteredAt") %>'></asp:TextBox>
        </EditItemTemplate>
        <ItemTemplate>
            <asp:Label ID="Label1" runat="server" Text='<%# Bind("TPREnteredAt") %>'></asp:Label>
        </ItemTemplate>
        <ControlStyle Width="90%" />
        <ItemStyle Width="24%" />
        <FooterTemplate>
            <asp:TextBox ID="lblEnteredAt" runat="server" Text="Will be added automatically" Width="24%" />
        </FooterTemplate>
    </asp:TemplateField>
    <asp:TemplateField HeaderText="Temp" SortExpression="TPRTemp">
        <EditItemTemplate>
            <asp:TextBox ID="txtTemp" runat="server" Text='<%# Eval("TPRTemp") %>'></asp:TextBox>
        </EditItemTemplate>
        <ItemTemplate>
            <asp:Label ID="Label2" runat="server" Text='<%# Bind("TPRTemp") %>'></asp:Label>
        </ItemTemplate>
        <FooterTemplate>
            <asp:TextBox ID="txtTemp" runat="server" Text='<%# Bind("TPRTemp")%>' Width="12%" />
        </FooterTemplate>
        <ControlStyle Width="90%" />
        <ItemStyle Width="12%" />
    </asp:TemplateField>
    <asp:TemplateField HeaderText="Pulse" SortExpression="TPRPulse">
        <EditItemTemplate>
            <asp:TextBox ID="txtPulse" runat="server" Text='<%# Eval("TPRPulse") %>'></asp:TextBox>
        </EditItemTemplate>
        <ItemTemplate>
            <asp:Label ID="Label3" runat="server" Text='<%# Bind("TPRPulse") %>'></asp:Label>
        </ItemTemplate>
        <FooterTemplate>
            <asp:TextBox ID="txtPulse" runat="server" Text='<%# Bind("TPRPulse")%>' Width="12%" />
        </FooterTemplate>
        <ControlStyle Width="90%" />
        <ItemStyle Width="12%" />
    </asp:TemplateField>
    <asp:TemplateField HeaderText="Respiration" SortExpression="TPRRespiration">
        <EditItemTemplate>
            <asp:TextBox ID="txtRespiration" runat="server" Text='<%# Eval("TPRRespiration") %>'></asp:TextBox>
        </EditItemTemplate>
        <ItemTemplate>
            <asp:Label ID="Label4" runat="server" Text='<%# Bind("TPRRespiration") %>'></asp:Label>
        </ItemTemplate>
        <FooterTemplate>
            <asp:TextBox ID="txtRespiration" runat="server" Text='<%# Bind("TPRRespiration")%>' Width="12%" />
        </FooterTemplate>
        <ControlStyle Width="90%" />
        <ItemStyle Width="12%" />
    </asp:TemplateField>
    <asp:TemplateField HeaderText="PCV">
        <EditItemTemplate>
            <asp:TextBox ID="txtPCV" runat="server" Text='<%# Bind("TPRPCV") %>'></asp:TextBox>
        </EditItemTemplate>
        <ItemTemplate>
            <asp:Label ID="Label5" runat="server" Text='<%# Bind("TPRPCV") %>'></asp:Label>
        </ItemTemplate>
        <FooterTemplate>
            <asp:TextBox ID="txtPCV" runat="server" Text='<%# Bind("TPRPCV")%>' Width="12%" />
        </FooterTemplate>
        <ControlStyle Width="90%" />
        <ItemStyle Width="12%" />
    </asp:TemplateField>
    <asp:TemplateField HeaderText="TP">
        <EditItemTemplate>
            <asp:TextBox ID="txtTP" runat="server" Text='<%# Bind("TPRTP") %>'></asp:TextBox>
        </EditItemTemplate>
        <ItemTemplate>
            <asp:Label ID="Label6" runat="server" Text='<%# Bind("TPRTP") %>'></asp:Label>
        </ItemTemplate>
        <FooterTemplate>
            <asp:TextBox ID="txtTP" runat="server" Text='<%# Bind("TPRTP")%>' Width="12%" />
        </FooterTemplate>
        <ControlStyle Width="90%" />
        <ItemStyle Width="12%" />
    </asp:TemplateField>
    <asp:TemplateField>
        <ItemTemplate>
            <asp:Button ID="lnkbtnEdit" runat="Server" Text="Edit" CommandName="Edit"
                CausesValidation="false"></asp:Button>

        </ItemTemplate>
        <EditItemTemplate>
            <asp:Button ID="lnkbtnUpdate" runat="Server" Text="Save" CommandName="Update"
                CausesValidation="true"></asp:Button><br />
            <asp:LinkButton ID="lnkbtnCancel" runat="Server" Text="Cancel" CommandName="Cancel"
                CausesValidation="false"></asp:LinkButton>
        </EditItemTemplate>
        <FooterTemplate>
            <asp:LinkButton ID="lnkbtnInsert" runat="Server" Text="Save" CommandName="Insert"
                CausesValidation="true"></asp:LinkButton>
        </FooterTemplate>
    </asp:TemplateField>
</Columns>
<EmptyDataTemplate>
    No TPR records exist
</EmptyDataTemplate>
</asp:GridView>

希望这能有所帮助！

你好，乌罗斯