如何在GridView行中添加不同的控件

Question

I have a gridview which I populate from the list data. every row in the gridview has a text box. there is one row within the gridview which I want a dropdown control rather then the textbox . I can't figure out how to change the textbox to dropdown control from a row in the grid.

My gridview below:

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false"  style="width:100%;" ShowHeader="false"
                     CellPadding="3" BackColor="White" ForeColor="Black" Font-Bold="false" GridLines="None"
                                    RowStyle-CssClass="GridRow">
    <Columns>
          <asp:TemplateField Visible="false">
               <ItemTemplate>
                   <asp:Label ID="lbl_ItemID" runat="server" Text='<%# Eval("GroupItemTypeID") %>' ></asp:Label>
               </ItemTemplate>
            </asp:TemplateField>
          <asp:TemplateField Visible="false">
               <ItemTemplate>
                   <asp:Label ID="lbl_ItemCode" runat="server" Text='<%# Eval("GroupItemTypeCode") %>' ></asp:Label>
               </ItemTemplate>
          </asp:TemplateField>
        <asp:TemplateField ItemStyle-Width="310px" >
            <ItemTemplate>
                <asp:Label ID="lbl_ItemValuesName" runat="server" Text='<%# Eval("ControlName") %>'  ></asp:Label>
            </ItemTemplate>
         </asp:TemplateField>
        <asp:TemplateField ItemStyle-Width="245px">
            <ItemTemplate>
                <asp:TextBox ID="txtPrice" runat="server"  CssClass="form-control"></asp:TextBox>
            </ItemTemplate>
        </asp:TemplateField>
        <asp:TemplateField ItemStyle-CssClass="RowWid">
            <ItemTemplate>
                <asp:Label ID="lbl_IsPercentbased" runat="server" Text='<%# Eval("PercentBasedText") %>'></asp:Label>
            </ItemTemplate>
        </asp:TemplateField>

        <asp:TemplateField ItemStyle-Width="70px">
            <ItemTemplate>
                <asp:CheckBox ID="ChkIsPercent" runat="server"  />
            </ItemTemplate>
        </asp:TemplateField>

    </Columns>
</asp:GridView>

Code behind

private void GetItemValues()
{
    List<Entities.ItemValues> IValues = new List<Entities.ItemValues>();

    IValues = BLL.PriceGroupItemValues.GetAllPriceGroupItemValues();

    GridView1.DataSource = IValues;

    GridView1.DataBind();

}

Answer 1

You can go for this approach in your case :

Put a TextBox and DropDown both in that TemplateField where your TextBox is currently, and set Visible=false in your Dropdown.

Now in your code-behind, you can use the GridView.RowDataBound event to alternatively display the TextBox or the Dropdown whenever and wherever you require. Something like this :

public void CustomersGridView_RowDataBound(Object sender, GridViewRowEventArgs e)
  {
    if(e.Row.RowType == DataControlRowType.DataRow)
    {
      // set Dropdown visible = true/false as per your requirement.
    }
    else
    {
      // set Textboxvisible = true/false as per your requirement.
    }
  }

This event will fire up for ear row in your GridView and based on the condition that is specified, you can manipulate which control you want to show in that particular row. You can find the dropdown control like this :

foreach (GridViewRow row in GridView1.Rows)
{
    categoryName = ((DropDownList)row.FindControl("ddlCategoryName"));
}

Hope this helps.

Answer 2

Use a placeholder control instead of a textbox and programmatically add either a textbox or DDL to the Placeholder control in the rowdatabound event based on your criteria

    <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False"
                  DataSourceID="SqlDataSource1"
                  DataKeyNames="user_id">
      <Columns>
        <asp:BoundField DataField="user_id" HeaderText="user_id" ReadOnly="True" InsertVisible="False"
                    SortExpression="user_id"></asp:BoundField>
        <asp:BoundField DataField="user_logon" HeaderText="user_logon" SortExpression="user_logon">
                </asp:BoundField>

        <asp:TemplateField>
          <ItemTemplate>
            <asp:PlaceHolder ID="PlaceHolder1" runat="server"></asp:PlaceHolder>
          </ItemTemplate>
        </asp:TemplateField>
      </Columns>
    </asp:GridView>

Sample DataSources

'Primary Datasource to bind to the gridview
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString='<%$ ConnectionStrings:SomeConnectionString %>'
    SelectCommand="select top 10 user_id, user_logon from your_user_table"></asp:SqlDataSource>

'Secondary datasource to bind to the ddl
<asp:SqlDataSource ID="SqlDataSource2" runat="server" ConnectionString='<%$ ConnectionStrings:SomeConnectionString %>'
    SelectCommand="select top 5 user_id, user_logon from your_user_table"></asp:SqlDataSource>

Code behind, based on the whether the user_id is odd or even I place one or the other control:

Private Sub GridView1_RowDataBound(sender As Object, e As GridViewRowEventArgs) Handles GridView1.RowDataBound
    If e.Row.RowType = DataControlRowType.DataRow Then
        Dim ph As PlaceHolder = e.Row.FindControl("PlaceHolder1")

        If GridView1.DataKeys(e.Row.RowIndex).Value Mod 2 = 0 Then
            Dim tb As New TextBox()
            tb.Enabled = False
            tb.Text = CType(e.Row.DataItem, DataRowView)("user_logon")
            ph.Controls.Add(tb)
        Else
            Dim ddl As New DropDownList()
            ddl.DataSourceID = SqlDataSource2.ID
            ddl.DataTextField = "user_logon"
            ddl.DataValueField = "user_id"
            ph.Controls.Add(ddl)
            ddl.DataBind()
        End If

    End If
End Sub

EDIT based on your Comments:

Private Sub GridView1_RowDataBound(sender As Object, e As GridViewRowEventArgs) Handles GridView1.RowDataBound
    If e.Row.RowType = DataControlRowType.DataRow Then
        Dim ph As PlaceHolder = e.Row.FindControl("PlaceHolder1")

        If CType(e.Row.DataItem, DataRowView)("GroupItemTypeID") ="SUBFREQ" Then
            Dim ddl As New DropDownList()
            ddl.DataSourceID = <substitute your requirements>
            ddl.DataTextField = ...
            ddl.DataValueField = ...
            ph.Controls.Add(ddl)
            ddl.DataBind()
        Else
            Dim tb As New TextBox()
            tb.Enabled = ...whatever...
            tb.Text = CType(e.Row.DataItem, DataRowView)("GroupItemTypeID")
            ph.Controls.Add(tb)
        End If

    End If
End Sub

Answer 3

Did some work around with the solution Harvey provided and my existing code. Posting my answer here.

In the gridview, created 2 control and visibility of one control(dropdown) to false

 <asp:TemplateField ItemStyle-Width="245px">
     <ItemTemplate>
         <asp:TextBox ID="txtPrice" runat="server"  CssClass="form-control"></asp:TextBox>
          <asp:DropDownList ID="ddFrequencyBilling" runat="server" CssClass="form-control" Visible="false"></asp:DropDownList>
    </ItemTemplate>
 </asp:TemplateField>

In the RowDataBound event of the gridview

 if (e.Row.RowType == DataControlRowType.DataRow)
            {
                //foreach( GridViewRow row in GridView1.Rows)
                //{
                    String ItemCode = (e.Row.FindControl("lbl_ItemCode") as Label).Text;

                    if ( ItemCode == "SUBFREQ")
                    {
                        List<Entities.ItemValues> PGItemValues = new List<Entities.ItemValues>();

                        TextBox TextBoxtemp = ((TextBox)e.Row.FindControl("txtPrice"));

                        TextBoxtemp.Visible = false;

                        Label lbel = ((Label)e.Row.FindControl("lbl_IsPercentbased"));

                        lbel.Visible = false;

                        CheckBox chk = ((CheckBox)e.Row.FindControl("ChkIsPercent"));

                        chk.Visible = false;

                        DropDownList dd1 = ((DropDownList)e.Row.FindControl("ddFrequencyBilling"));

                        dd1.Visible = true;

                        PGItemValues = BLL.PriceGroupItemValues.GetItemValueOnCode(ItemCode, 1);

                        dd1.DataSource = PGItemValues;

                        dd1.DataTextField = "IValue";

                        dd1.DataValueField = "ItemCode";

                        dd1.DataBind();
                    }
                //}
            }

and yes it worked. Thanks alot guys.