2011-07-13 4 views
1

Le travail de code ci-dessous très bien, mais ma question est la suivante:Ajout d'une nouvelle ligne dans GridView

Lorsque je clique sur ajouter une nouvelle: au lieu de montrer au pied de page, est-il un moyen que je peux montrer au-dessus de tout lignes (comme dans l'en-tête)? Si j'ai 15 lignes, la nouvelle ligne vide sera tout le chemin à la fin, je veux le rendre facile sur l'utilisateur et montrer à la première rangée.

<asp:GridView ID="GridView1" runat="server" BackColor="White" 
BorderColor="#3366CC" BorderStyle="None" BorderWidth="1px" CellPadding="4" AllowSorting="True" AutoGenerateColumns="False" ShowFooter="True" OnRowCommand="GridView1_RowCommand"> 
<FooterStyle BackColor="#99CCCC" ForeColor="#003399" /> 
<RowStyle BackColor="White" ForeColor="#003399" /> 
<PagerStyle BackColor="#99CCCC" ForeColor="#003399" HorizontalAlign="Left" /> 
<SelectedRowStyle BackColor="#009999" Font-Bold="True" ForeColor="#CCFF99" /> 
<HeaderStyle BackColor="#003399" Font-Bold="True" ForeColor="#CCCCFF" /> 
<Columns> 
<asp:BoundField DataField="PersonID" HeaderText="PersonID" /> 
<asp:TemplateField HeaderText="Name"> 
<ItemTemplate> 
<asp:Label ID="Label1" Text='<%# Eval("Name") %>' runat="server"></asp:Label> 
</ItemTemplate> 
<FooterTemplate> 
<asp:TextBox ID="txtName" runat="server"></asp:TextBox> 
<asp:Button ID="Button1" CommandName = "ADD" runat="server" 
Text="Add" /> 
</FooterTemplate> 
</asp:TemplateField> 
</Columns> 
</asp:GridView> 

Répondre

2

Vous pouvez afficher la ligne d'ajout dans l'en-tête et/ou le pied de page, jetez un oeil à RowCreated -Event.

ASPX:

<asp:GridView ID="GridView1" runat="server" BackColor="White" BorderColor="#3366CC" 
    BorderStyle="None" BorderWidth="1px" CellPadding="4" AllowSorting="True" AutoGenerateColumns="False" 
    ShowFooter="True" OnRowCommand="GridView1_RowCommand" OnRowCreated="GridView1_RowCreated"> 
    <FooterStyle BackColor="#99CCCC" ForeColor="#003399" /> 
    <RowStyle BackColor="White" ForeColor="#003399" /> 
    <PagerStyle BackColor="#99CCCC" ForeColor="#003399" HorizontalAlign="Left" /> 
    <SelectedRowStyle BackColor="#009999" Font-Bold="True" ForeColor="#CCFF99" /> 
    <HeaderStyle BackColor="#003399" Font-Bold="True" ForeColor="#CCCCFF" /> 
    <Columns> 
     <asp:BoundField DataField="PersonID" HeaderText="PersonID" /> 
     <asp:TemplateField HeaderText="Name"> 
      <ItemTemplate> 
       <asp:Label ID="Label1" Text='<%# Eval("Name") %>' runat="server"></asp:Label> 
      </ItemTemplate> 
      <FooterTemplate> 
       <asp:TextBox ID="txtName" runat="server"></asp:TextBox> 
       <asp:Button ID="BtnAdd" CommandName="ADD" runat="server" Text="Add" /> 
      </FooterTemplate> 
     </asp:TemplateField> 
    </Columns> 
</asp:GridView> 

Codebehind:

Public Class GridViewAddRowTop 
    Inherits System.Web.UI.Page 

    Protected Sub GridView1_RowCreated(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) 
     If e.Row.RowType = DataControlRowType.Header Then 
      Dim extraRow As New GridViewRow(1, -1, DataControlRowType.Header, DataControlRowState.Normal) 
      Dim emptyCell As New TableCell() 
      Dim tc As TableCell = New DataControlFieldCell(DirectCast(e.Row.Cells(0), DataControlFieldCell).ContainingField) 
      Dim BtnAdd As New Button() 
      Dim TxtName As New TextBox 
      emptyCell.Controls.Add(New LiteralControl("&nbsp;")) 
      extraRow.Cells.Add(emptyCell) 
      TxtName.ID = "TxtName" 
      tc.Controls.Add(TxtName) 
      BtnAdd.ID = "BtnAdd" 
      BtnAdd.CommandName = "ADD" 
      BtnAdd.Text = "Add" 
      tc.Controls.Add(BtnAdd) 
      extraRow.Cells.Add(tc) 
      DirectCast(sender, GridView).Controls(0).Controls.Add(extraRow) 
     End If 
    End Sub 

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load 
     If Not IsPostBack Then 
      Dim tbl = getDataSource() 
      Me.GridView1.DataSource = tbl 
      Me.GridView1.DataBind() 
     End If 
    End Sub 

    Private Function getDataSource() As DataTable 
     Dim tbl = New DataTable() 
     Dim idColumn = New DataColumn("PersonID", GetType(Int32)) 
     idColumn.AutoIncrement = True 
     tbl.Columns.Add(idColumn) 
     tbl.Columns.Add(New DataColumn("Name", GetType(String))) 
     For i As Int32 = 1 To 15 
      Dim newRow = tbl.NewRow 
      newRow("Name") = i & ".Name" 
      tbl.Rows.Add(newRow) 
     Next 
     Return tbl 
    End Function 

    Protected Sub GridView1_RowCommand(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewCommandEventArgs) 
     If e.CommandName.ToUpper = "ADD" Then 
      Dim tbl = getDataSource() 
      Dim newRow = tbl.NewRow 
      Dim bu As New Button 
      Dim txtName = DirectCast(DirectCast(e.CommandSource, WebControl).NamingContainer.FindControl("txtName"), TextBox) 
      newRow("Name") = txtName.Text 
      tbl.Rows.Add(newRow) 
      DirectCast(sender, GridView).DataSource = tbl 
      DirectCast(sender, GridView).DataBind() 
     End If 
    End Sub 

End Class 

Remarque: cet exemple ajoutera un "add-ligne" à la HeaderRow (en haut) et le FooterRow (retirer la FooterTemplate si désiré). Si vous voulez l'ajouter au-dessous des colonnes d'en-tête générées automatiquement, je vais devoir l'examiner de plus près. Parce que l'en-tête n'existe pas à ce moment dans RowCreated, j'ai eu le problème d'ajouter ma nouvelle ligne en dessous.

+0

est-ce créer la dynamique de contrôle? il ressemble à ça, s'il ne peut pas afficher après le headerrow alors c'est mieux d'utiliser headertemplate correct? Alors, quel est le diff? –

+0

@Abu Hamzah: Utiliser HeaderTemplate perdra les capacités de tri intégrées (lien hypertexte sur les colonnes avec [SortExpression] (http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.gridview.sortexpression. aspx)). Cela devrait faire manuellement, contrairement à mon approche. –

+0

Je ne suis pas sûr de comprendre si vous pouvez reformuler –

0

Avez-vous essayé de placer le balisage FooterTemplate ci-dessus dans HeaderTemplate? Cela devrait fonctionner.

+0

Je place le balisage sur le gabarit d'en-tête mais quand la page le charge automatiquement en mode saisie et plus il n'y a pas d'en-tête parce que je mets l'entête et ce que je veux quand je clique sur "ajouter nouveau" alors seulement je la ligne à montrer en mode de saisie. –

Questions connexes