在GridView中呼叫FormVIew做新增、編輯
- 2008-02-06
- 41156
- 0
雖然說GridView也可以直接編輯,但是那小小的一格,有時候需要填入許多的資訊,使用者來用是很不方便的,所以我們利用傳送pk值的方式呼叫FormView來做編輯的動作,當然新增也就順便叫FormView處理囉。
?小鋪廢言:此範例使用北風資料庫的Territories資料表,為了畫面較短demo有加上top(5)
◆首先先製作一個基本的GridView出來,然後將UpdateCommand、InsertCommand兩個命令子句幹掉
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="TerritoryID" DataSourceID="SqlDataSource1" EmptyDataText="沒有資料錄可顯示。"> <Columns> <asp:BoundField DataField="TerritoryID" HeaderText="TerritoryID" ReadOnly="True" SortExpression="TerritoryID" /> <asp:BoundField DataField="TerritoryDescription" HeaderText="TerritoryDescription" SortExpression="TerritoryDescription" /> <asp:BoundField DataField="RegionID" HeaderText="RegionID" SortExpression="RegionID" /> </Columns> </asp:GridView> <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="" DeleteCommand="DELETE FROM [Territories] WHERE [TerritoryID] = @TerritoryID" ProviderName="" SelectCommand="SELECT top(5) [TerritoryID], [TerritoryDescription], [RegionID] FROM [Territories]"> <DeleteParameters> <asp:Parameter Name="TerritoryID" Type="String" /> </DeleteParameters> </asp:SqlDataSource>
◆然後我們按下GridView的智慧型標籤,選擇編輯資料行

◆點一下TemplateField→加入→確定有加入→確定

◆回到GridView後按下智慧型標籤,選擇編輯樣板

◆到編輯樣板的模式後拉兩個LinkButton出來點選智慧型標籤

◆選擇編輯DataBindings...

◆我們要把CommandArgument繫結到該資料表的pk欄位(與圖說指令不同)

◆回到GridView樣板編輯模式後點一下LinkBotton1將右邊屬性視窗改成下方圖說

◆再點一下LinkBotton2將右邊屬性視窗改成下方圖說

♥小提醒:這有一點不同,因為我們在OnClientClick加了一個confirm視窗語法如下請複製貼上
- return confirm('刪除資料?');
◆然後你的GridView應該會變成這樣
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="TerritoryID"
DataSourceID="SqlDataSource1" EmptyDataText="沒有資料錄可顯示。">
<Columns>
<asp:BoundField DataField="TerritoryID" HeaderText="TerritoryID" ReadOnly="True"
SortExpression="TerritoryID" />
<asp:BoundField DataField="TerritoryDescription" HeaderText="TerritoryDescription"
SortExpression="TerritoryDescription" />
<asp:BoundField DataField="RegionID" HeaderText="RegionID" SortExpression="RegionID" />
<asp:TemplateField>
<ItemTemplate>
<asp:LinkButton ID="LinkButton1" runat="server" CausesValidation="False" CommandArgument='<%# Eval("TerritoryID") %>'
CommandName="edit2" Text="編輯"></asp:LinkButton>
<asp:LinkButton ID="LinkButton2" runat="server" CommandArgument='<%# Eval("TerritoryID") %>'
CommandName="Delete" ForeColor="Red" OnClientClick="return confirm('刪除資料?');">刪除</asp:LinkButton>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
◆接者我們要來建立一個FormView,請注意要用不同的SqlDataSource唷,並且要勾選進階讓他支援編輯新增

◆然後點選FormView的智慧型標籤,選擇編輯樣板,將ItemTemplate樣板的內容全部幹掉(注意看我們是用不同的SqlDataSource)


◆然後把FormView加上ItemInserted和ItemUpdated事件,你的FormView就會變成這樣
<asp:FormView ID="FormView1" runat="server" DataKeyNames="TerritoryID" DataSourceID="SqlDataSource2" OnItemInserted="FormView1_ItemInserted" OnItemUpdated="FormView1_ItemUpdated">
<EditItemTemplate>
TerritoryID:
<asp:Label ID="TerritoryIDLabel1" runat="server" Text='<%# Eval("TerritoryID") %>'>
</asp:Label><br />
TerritoryDescription:
<asp:TextBox ID="TerritoryDescriptionTextBox" runat="server" Text='<%# Bind("TerritoryDescription") %>'>
</asp:TextBox><br />
RegionID:
<asp:TextBox ID="RegionIDTextBox" runat="server" Text='<%# Bind("RegionID") %>'>
</asp:TextBox><br />
<asp:LinkButton ID="UpdateButton" runat="server" CausesValidation="True" CommandName="Update"
Text="更新">
</asp:LinkButton>
<asp:LinkButton ID="UpdateCancelButton" runat="server" CausesValidation="False" CommandName="Cancel"
Text="取消">
</asp:LinkButton>
</EditItemTemplate>
<InsertItemTemplate>
TerritoryID:
<asp:TextBox ID="TerritoryIDTextBox" runat="server" Text='<%# Bind("TerritoryID") %>'>
</asp:TextBox><br />
TerritoryDescription:
<asp:TextBox ID="TerritoryDescriptionTextBox" runat="server" Text='<%# Bind("TerritoryDescription") %>'>
</asp:TextBox><br />
RegionID:
<asp:TextBox ID="RegionIDTextBox" runat="server" Text='<%# Bind("RegionID") %>'>
</asp:TextBox><br />
<asp:LinkButton ID="InsertButton" runat="server" CausesValidation="True" CommandName="Insert"
Text="插入">
</asp:LinkButton>
<asp:LinkButton ID="InsertCancelButton" runat="server" CausesValidation="False" CommandName="Cancel"
Text="取消">
</asp:LinkButton>
</InsertItemTemplate>
</asp:FormView>
◆然後在頁面上新增一個HiddenField控制項,再把GridView加上RowCommand事件,在該事件中寫以下code
protected void GridView1_RowCommand(object sender, GridViewCommandEventArgs e)
{
//如果按下的命令名稱為edit2
if (e.CommandName == "edit2")
{
//將HiddenField1的值填入該GridView_RowCommand的CommandArgument
this.HiddenField1.Value = e.CommandArgument.ToString();
//把FormView的模式換成編輯
this.FormView1.ChangeMode(FormViewMode.Edit);
}
}
◆然後我們在FormView的SqlDataSource中的UpdateCommand語句改成以下
UpdateCommand="UPDATE [Territories] SET [TerritoryDescription] = @TerritoryDescription, [RegionID] = @RegionID WHERE [TerritoryID] = @TerritoryID">
◆再來把剛剛新增的兩個FormView的temUpdated、ItemInserted事件中都加入以下code
//如果新增或編輯沒有錯誤就把GridView重新繫結
if (e.Exception == null)
this.GridView1.DataBind();
?小鋪廢言:這樣子我們就完成了基本的GridView呼叫FormView來編輯的動作,新增也是一樣,就是抓到新增命令後把FormView的模式換成Inert而已,因為FormView比較靈活所以除非編輯的資料很短,不然都可以使用此方式,如果您結合了AJAX技術,那用這種方式會更好。
★注意事事項:北風資料庫無法新增刪除!!請注意








回應討論