javascript - asp.net 数据输入静态网格

Question

我正在创建数据输入应用程序，并且我有一个我希望它的外观和功能的示例。我喜欢静态的网格，您可以单击单元格进行编辑。我附上了一张我想要的照片。有人能告诉我这是如何创建的吗？

Answer 1

这是一个.net GridView使用row commands添加/更新/删除。

这是一个使用 SQL 数据库的示例:

<asp:GridView ID="gv" RunAt="Server" DataSourceID="sqlGrid" DataKeyNames="RowID" AllowPaging="False" AutoGenerateColumns="false" EnableModelValidation="True" AutoGenerateEditButton="False" AutoGenerateDeleteButton="False" GridLines="None" BorderWidth="0">
  <Columns>
    <asp:BoundField HeaderText="Col1" DataField="Col1" SortExpression="Col1"/>
    <asp:BoundField runat="Server" HeaderText="Col2" DataField="Col2" SortExpression="Col2"/>
    <asp:CommandField HeaderText="Edit" ShowEditButton="True"/>
    <asp:CommandField HeaderText="Delete" ShowDeleteButton="True"/>
  </Columns>
</asp:GridView>

<asp:SqlDataSource ID="sqlGrid" RunAt="Server" SelectCommand="spGrid" SelectCommandType="StoredProcedure" UpdateCommand="spGridUpdate" UpdateCommandType="StoredProcedure" DeleteCommand="spGridDelete" DeleteCommandType="StoredProcedure">
  <UpdateParameters>
    <asp:Parameter Name="Col1" Type="String" />
    <asp:Parameter Name="Col2" Type="String" />
    <asp:Parameter Name="RowID" Type="Int32" DefaultValue="0" />
  </UpdateParameters>
</asp:SqlDataSource>

要直接在网格中输入，请使用 TemplateFields在单元格中插入文本框。单击“保存”会将单元格的内容提交回您的数据库。

<小时/>

创建空白行

<asp:TemplateField HeaderText="Col1" SortExpression="Col1">
    <ItemTemplate>
        <asp:TexBox ID="txt1" runat="server"></asp:TexBox >
        <asp:TexBox ID="txt2" runat="server"></asp:TexBox >
    </ItemTemplate>
</asp:TemplateField>

<小时/>

工作流程

1. 创建数据库/表/列。
2. 创建存储过程来读取/编辑/删除数据库数据。
3. 使用模板字段和文本框创建 GridView 。
4. 使用存储过程在 gridview 中填充数据。
5. 使用 sqlDataSource 和 row 命令从 gridview 更新数据。