Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Retrieve value from DropDownList in nested GridView on RowCommand

I have a nested GridView(GvMP_Summary_Items). Each row contains a DropDownList. The DropDownList is bounded on the RowDataBound event of the nested GridView.

Each row also contains 1 Button. Upon pressing this button on the RowCommand event, I would like to find the current selected value of the DropDownList so I can use it further on in the code.

The code I have will only get the default value of the DropDownList on each row, which is currently set at 0 for each row.

Below is the RowCommand Event:

Protected Sub GvMP_Summary_Items_RowCommand(sender As Object, e As GridViewCommandEventArgs)

  Dim lb As ImageButton = CType(e.CommandSource, ImageButton)
  Dim gvRow As GridViewRow = lb.BindingContainer //Getting current row to get index       

  Dim GvMP_Summary_Items As GridView = CType(gvRow.FindControl("GvMP_Summary_Items"), GridView)

  Dim intMPItem_Qty As Integer = CType(gvRow.FindControl("cboMPItem_Qty"), DropDownList).SelectedValue
  Dim strMPItem_Qty As String = CType(gvRow.FindControl("txtMPItem_Qty"), TextBox).Text

End Sub

I have even included a TextBox in the GridView row which default value is empty "". Although on the row if something is entered the on RowCommand event brings back the value with a comma(,) in front of it.

This proves that I am picking up the correct row and can retrieve a value from a TextBox but not a DropDownList.

Is there something I am missing? Why can I return a value entered in a TextBox but not the selected value of a DropDownList? Also why the comma(,) in front of the TextBox value?

Note: In above case code has been written using VB so answers in VB over C# but I can accept both.

like image 681
PringlePCS Avatar asked Jan 08 '18 15:01

PringlePCS


1 Answers

Important things:

  1. Bind parent GridView in Page_Load method
  2. Bind child GridView in parent GridView 's RowDataBound event
  3. Bind DropDownList in child GridView 's RowDataBound event
  4. Add CommandName to the Button which is inside child GridView
  5. Finally, in RowCommand event of child GridView
    • Get child GridView 's row
    • Then find all controls inside child GridView from child GridView 's row

I'm not so aware of VB.NET so I have added an example (c#) of Nested GridView with RowCommand event (hope OP can use it in VB.NET):

HTML Code (.Aspx):

<form id="form1" runat="server">

<asp:GridView ID="GridView_Outer" OnRowDataBound="GridView_Outer_RowDataBound" AutoGenerateColumns="false" runat="server">
    <Columns>
        <asp:TemplateField HeaderText="Outer Column1">
            <ItemTemplate>
                <asp:Label ID="Label_Outer" runat="server" Text='<%# Eval("Label_Outer") %>'></asp:Label>
            </ItemTemplate>
        </asp:TemplateField>
        <asp:TemplateField HeaderText="Outer Column2">
            <ItemTemplate>
                <asp:GridView ID="GridView_Inner" OnRowDataBound="GridView_Inner_RowDataBound" OnRowCommand="GridView_Inner_RowCommand" AutoGenerateColumns="false" runat="server">
                    <Columns>
                        <asp:TemplateField HeaderText="Inner Column1">
                            <ItemTemplate>
                                <asp:Label ID="Label_Inner" runat="server" Text='<%# Eval("Label_Inner") %>'></asp:Label>
                            </ItemTemplate>
                        </asp:TemplateField>
                        <asp:TemplateField HeaderText="Inner Column2">
                            <ItemTemplate>
                                <asp:TextBox ID="TextBox_Inner" Text='<%# Eval("TextBox_Inner") %>' runat="server"></asp:TextBox>
                            </ItemTemplate>
                        </asp:TemplateField>
                        <asp:TemplateField HeaderText="Inner Column3">
                            <ItemTemplate>
                                <asp:DropDownList ID="DropDownList_Inner" runat="server"></asp:DropDownList>
                            </ItemTemplate>
                        </asp:TemplateField>
                        <asp:TemplateField HeaderText="Inner Column4">
                            <ItemTemplate>
                                <asp:Button ID="Button_Inner" runat="server" CommandName="BtnInnerCmd" Text="Inner Button" />
                            </ItemTemplate>
                        </asp:TemplateField>
                    </Columns>
                </asp:GridView>
            </ItemTemplate>
        </asp:TemplateField>
    </Columns>
</asp:GridView>
<br />
<asp:Label ID="Label_Result" runat="server"></asp:Label>

</form>

Code-Behind (.Aspx.cs):

DataTable TempDT = new DataTable();

protected void Page_Load(object sender, EventArgs e)
{
    CreateDataTable();

    if (!IsPostBack)
    {
        GridView_Outer.DataSource = TempDT;
        GridView_Outer.DataBind();
    }
}

// create DataTable
public void CreateDataTable()
{
    TempDT = new DataTable();
    TempDT.Columns.Add("Label_Outer");
    TempDT.Columns.Add("Label_Inner");
    TempDT.Columns.Add("TextBox_Inner");

    TempDT.Rows.Add("OuterLabel", "InnerLabel", "");
    TempDT.Rows.Add("OuterLabel", "InnerLabel", "");

    // store DataTable into ViewState to prevent data loss on PostBack
    ViewState["DT"] = TempDT;
}

// Calls Outer GridView on Data Binding
protected void GridView_Outer_RowDataBound(object sender, GridViewRowEventArgs e)
{
    // check if gridview row is not in edit mode
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        // Get Outer GrridView 's controls
        Label Label_Outer = (Label)e.Row.FindControl("Label_Outer");
        GridView GridView_Inner = (GridView)e.Row.FindControl("GridView_Inner");

        // get DataTable from ViewState and set to Inner GridView
        GridView_Inner.DataSource = (DataTable)ViewState["DT"];
        GridView_Inner.DataBind();
    }
}

// Calls Inner GridView on Data Binding
protected void GridView_Inner_RowDataBound(object sender, GridViewRowEventArgs e)
{
    // check if gridview row is not in edit mode
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        // Get Outer GrridView 's controls
        DropDownList DropDownList_Inner = (DropDownList)e.Row.FindControl("DropDownList_Inner");

        // Create a DataTable to Bind data for DropDownlist
        DataTable TempDDLDT = new DataTable();
        TempDDLDT.Columns.Add("ItemText");
        TempDDLDT.Columns.Add("ItemValue");

        TempDDLDT.Rows.Add("ItemText1", "ItemValue1");
        TempDDLDT.Rows.Add("ItemText2", "ItemValue2");

        // bind DataTable to the DropDownList
        DropDownList_Inner.DataSource = TempDDLDT;
        DropDownList_Inner.DataTextField = "ItemText";
        DropDownList_Inner.DataValueField = "ItemValue";
        DropDownList_Inner.DataBind();
    }
}

// Calls when Inner GridView 's button clicked
protected void GridView_Inner_RowCommand(object sender, GridViewCommandEventArgs e)
{
    // get Inner GridView 's clicked row
    GridViewRow InnerGridViewRow = (GridViewRow)(((Control)e.CommandSource).NamingContainer);

    // get Inner GridView 's controls from clicked row
    TextBox TextBox_Inner = (TextBox)InnerGridViewRow.FindControl("TextBox_Inner");
    DropDownList DropDownList_Inner = (DropDownList)InnerGridViewRow.FindControl("DropDownList_Inner");

    // check if correct button is clicked
    if (e.CommandName == "BtnInnerCmd")
    {
        string DropDownListValue = DropDownList_Inner.SelectedValue;
        string TextBoxValue = TextBox_Inner.Text;

        Label_Result.Text = "DropDownList 's Selected Value is " + DropDownListValue +
                            "<br />TextBox 's Entered Value is " + TextBoxValue;
    }
}

Demo Image:

enter image description here Note: Above DropDownList selects Selected Value not Text.

like image 167
stefan Avatar answered Oct 05 '22 04:10

stefan