asp.net gridviewの2つの行itemtemplateとfootertemplate

Question

私は行を追加できるビューを作成する必要があるページがあり、そのビューはこのように見える必要があります。ここ

第二行は、大きなテキストボックスを有しています。データを入力して[新しいリンクを追加]をクリックすると、行がDBに保存され、表示され、新しいフッター行が新しいデータを埋めるように表示されます。 私はgoogleとsoを使い、ListView、DataListを見つけましたが、これを実現する方法を理解できませんでした。私はこの質問が重複かもしれないことを知っています。しかし、私はスクリーンショットを通して必要なものを見せたいと思っていました。

もう少しお手伝いし、正しい方向を導いてください。ありがとう。

Answer 1

GridViewのRowCreatedイベントでこれを行うことができます。ただし、余分な行は通常のヘッダーとフッターの行の上に配置されます。必要に応じて、余分な行にコントロールを追加することもできます。しかし、ダイナミックに作成されたコントロールはすべてのPostBackで再作成する必要があるので、データバインドはIsPostBackチェック内にあってはいけません。

protected void GridView1_RowCreated(object sender, GridViewRowEventArgs e) 
{ 
    //cast the sender back to a gridview 
    GridView gv = sender as GridView; 

    //check if the row is the header row 
    if (e.Row.RowType == DataControlRowType.Header) 
    { 
     //create a new row 
     GridViewRow extraHeader = new GridViewRow(0, 0, DataControlRowType.Header, DataControlRowState.Insert); 
     extraHeader.BackColor = Color.Red; 

     //loop all the columns and create a new cell for each 
     for (int i = 0; i < gv.Columns.Count; i++) 
     { 
      TableCell cell = new TableCell(); 
      cell.Text = "ExtraHeader " + i; 

      //add the cell to the new header row 
      extraHeader.Cells.Add(cell); 
     } 

     //add the new row to the gridview 
     gv.Controls[0].Controls.AddAt(0, extraHeader); 
    } 

    //check if the row is the footer row 
    if (e.Row.RowType == DataControlRowType.Footer) 
    { 
     //create a new row 
     GridViewRow extraFooter = new GridViewRow(0, 0, DataControlRowType.Footer, DataControlRowState.Insert); 
     extraFooter.BackColor = Color.Green; 

     //add one cell with colspan 2 
     TableCell cell1 = new TableCell(); 
     cell1.Text = "ExtraFooter 1"; 
     cell1.ColumnSpan = 2; 
     extraFooter.Cells.Add(cell1); 

     //add another one with colspanning the rest 
     TableCell cell2 = new TableCell(); 
     cell2.Text = "ExtraFooter 2"; 
     cell2.ColumnSpan = gv.Columns.Count - 2; 
     extraFooter.Cells.Add(cell2); 

     //add +2 to the row count. one for the extra header and 1 for the extra footer 
     int insertIndex = gv.Rows.Count + 2; 

     //add the new row to the gridview 
     gv.Controls[0].Controls.AddAt(insertIndex, extraFooter); 
    } 
}