locked
Dropdown in Item/Edit Template RRS feed

  • Question

  • User1769015664 posted

    How do I modify the code below for the field "Code" to be a dropdown instead of textbox? The dropdown needs to have data from the database and I should be able to use it to Insert new row as well as when Updating existing rows. 

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="A1.aspx.cs" Inherits="WebApplication4.A1" %>
    
    <!DOCTYPE html>
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
    </head>
    <body>
        <form id="form1" runat="server">
    
            <asp:SqlDataSource ID="SqlDataSource1" runat="server" 
                ConnectionString="<%$ ConnectionStrings:Cstr %>" 
                DeleteCommand="DELETE FROM [tblSupplier] WHERE [ID] = @ID" 
                InsertCommand="INSERT INTO [tblSupplier] (
    , [Name], [Address], [ContactNo], [LastDelivery]) VALUES (@Code, @Name, @Address, @ContactNo, @LastDelivery)" 
                SelectCommand="SELECT * FROM [tblSupplier]" 
            
                UpdateCommand="UPDATE [tblSupplier] SET 
     = @Code, [Name] = @Name, [Address] = @Address, [ContactNo] = @ContactNo, [LastDelivery] = @LastDelivery WHERE [ID] = @ID" 
                oninserting="SqlDataSource1_Inserting">
                <DeleteParameters>
                    <asp:Parameter Name="ID" Type="Int64" />
                </DeleteParameters>
                <InsertParameters>
                    <asp:Parameter Name="Code" Type="String" />
                    <asp:Parameter Name="Name" Type="String" />
                    <asp:Parameter Name="Address" Type="String" />
                    <asp:Parameter Name="ContactNo" Type="String" />
                    <asp:Parameter Name="LastDelivery" Type="DateTime" />
                </InsertParameters>
                <UpdateParameters>
                    <asp:Parameter Name="Code" Type="String" />
                    <asp:Parameter Name="Name" Type="String" />
                    <asp:Parameter Name="Address" Type="String" />
                    <asp:Parameter Name="ContactNo" Type="String" />
                    <asp:Parameter Name="LastDelivery" Type="DateTime" />
                    <asp:Parameter Name="ID" Type="Int64" />
                </UpdateParameters>
            </asp:SqlDataSource>
    
            <asp:GridView ID="GridView1" runat="server" Width="100%" AutoGenerateColumns="False" DataKeyNames="ID"
            DataSourceID="SqlDataSource1" OnRowCommand="GridView1_RowCommand" ShowFooter="True" HeaderStyle-BackColor="CornflowerBlue" HeaderStyle-Font-Bold="true" HeaderStyle-ForeColor="White" CellPadding="5">
                <Columns>
    
                <asp:TemplateField HeaderText="Action">
                <ItemTemplate>
                <asp:Button runat="server" ID="cmdEdit" Text="Edit" CommandName="Edit" />
                <asp:Button runat="server" ID="cmdDelete" OnClientClick="return confirm('Are you sure to delete')" Text="Delete" CommandName="Delete" />
                </ItemTemplate>
                <EditItemTemplate>
                <asp:Button runat="server" ID="cmdUpdate" Text="Update" CommandName="Update" />
                <asp:Button runat="server" ID="cmdCancel" Text="Cancel" CommandName="Cancel" />
                </EditItemTemplate>
                <FooterTemplate>
                <asp:Button runat="server" ID="cmdAdd" Text="Add Supplier" CommandName="New" />
                </FooterTemplate>
                </asp:TemplateField>
    
                <asp:TemplateField HeaderText="Code">
                <ItemTemplate><%# Eval("Code") %></ItemTemplate>
                <EditItemTemplate>
                <asp:TextBox runat="server" ID="Code" Text='<%# Bind("Code")%>' />
                </EditItemTemplate>
                <FooterTemplate>
                <asp:TextBox runat="server" ID="txtCode" Text='' />
                </FooterTemplate>
                </asp:TemplateField>
    
                <asp:TemplateField HeaderText="Name">
                <ItemTemplate><%# Eval("Name") %></ItemTemplate>
                <EditItemTemplate>
                <asp:TextBox runat="server" ID="EditName" Text='<%# Bind("Name")%>' />
                </EditItemTemplate>
                <FooterTemplate>
                <asp:TextBox runat="server" ID="txtName" Text='' />
                </FooterTemplate>
                </asp:TemplateField>
    
                <asp:TemplateField HeaderText="Address">
                <ItemTemplate><%# Eval("Address") %></ItemTemplate>
                <EditItemTemplate>
                <asp:TextBox runat="server" ID="EditAddress" Text='<%# Bind("Address")%>' />
                </EditItemTemplate>
                <FooterTemplate>
                <asp:TextBox runat="server" ID="txtAddress" Text='' />
                </FooterTemplate>
                </asp:TemplateField>
    
                <asp:TemplateField HeaderText="Contact No">
                <ItemTemplate><%# Eval("ContactNo") %></ItemTemplate>
                <EditItemTemplate>
                <asp:TextBox runat="server" ID="EditContactNo" Text='<%# Bind("ContactNo")%>' />
                </EditItemTemplate>
                <FooterTemplate>
                <asp:TextBox runat="server" ID="txtContactNo" Text='' />
                </FooterTemplate>
                </asp:TemplateField>
    
                </Columns>
    
                <EmptyDataTemplate>
                    <table width="500px">
                    <tr style="background:#FF6600;color:White"><th>Code</th><th>Name
                    </th><th>Address</th><th>Contact No</th><th>Action</th></tr>
                    <tr>
                    <td><asp:TextBox runat="server" ID="txtCode" /></td>
                    <td><asp:TextBox runat="server" ID="txtName" /></td>
                    <td><asp:TextBox runat="server" ID="txtAddress" /></td>
                    <td><asp:TextBox runat="server" ID="txtContactNo" /></td>
                    <td><asp:Button runat="server" ID="cmdAdd" Text="Add Supplier" CommandName="EmptyNew" /></td>
                    </tr>
                    </table>
                </EmptyDataTemplate>
    
            </asp:GridView>
    
        </form>
    </body>
    </html>
    
    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    
    using System.Data;
    using System.Text;
    using System.Configuration;
    using System.Data.SqlClient;
    using System.Globalization;
    using System.Drawing;
    using System.Web.UI.HtmlControls;
    using System.Data.OleDb;
    
    namespace WebApplication4
    {
        public partial class A1 : System.Web.UI.Page
        {
            private System.Data.SqlClient.SqlParameter Code = new System.Data.SqlClient.SqlParameter("Code", SqlDbType.Char, 6);
            private System.Data.SqlClient.SqlParameter Name = new System.Data.SqlClient.SqlParameter("Name", SqlDbType.VarChar, 100);
            private System.Data.SqlClient.SqlParameter Address = new System.Data.SqlClient.SqlParameter("Address", SqlDbType.VarChar, 200);
            private System.Data.SqlClient.SqlParameter ContactNo = new System.Data.SqlClient.SqlParameter("ContactNo", SqlDbType.Char, 6);
            private System.Data.SqlClient.SqlParameter LastDelivery = new System.Data.SqlClient.SqlParameter("LastDelivery", SqlDbType.DateTime);
    
            protected void Page_Load(object sender, EventArgs e)
            {
    
            }
    
            protected void GridView1_RowCommand(object sender, GridViewCommandEventArgs e)
            {
                if (e.CommandName == "EmptyNew")
                {
                    Code.Direction = ParameterDirection.Input;
                    Code.Value = ((TextBox)GridView1.Controls[0].Controls[0].FindControl("txtCode")).Text;
                    Name.Direction = ParameterDirection.Input;
                    Name.Value = ((TextBox)GridView1.Controls[0].Controls[0].FindControl("txtName")).Text;
                    Address.Direction = ParameterDirection.Input;
                    Address.Value = ((TextBox)GridView1.Controls[0].Controls[0].FindControl("txtAddress")).Text;
                    ContactNo.Direction = ParameterDirection.Input;
                    ContactNo.Value = ((TextBox)GridView1.Controls[0].Controls[0].FindControl("txtContactNo")).Text;
                    SqlDataSource1.Insert();
                }
    
                if (e.CommandName == "New")
                {
                    Code.Direction = ParameterDirection.Input;
                    Code.Value = ((TextBox)GridView1.FooterRow.FindControl("txtCode")).Text;
                    Name.Direction = ParameterDirection.Input;
                    Name.Value = ((TextBox)GridView1.FooterRow.FindControl("txtName")).Text;
                    Address.Direction = ParameterDirection.Input;
                    Address.Value = ((TextBox)GridView1.FooterRow.FindControl("txtAddress")).Text;
                    ContactNo.Direction = ParameterDirection.Input;
                    ContactNo.Value = ((TextBox)GridView1.FooterRow.FindControl("txtContactNo")).Text;
                    LastDelivery.Direction = ParameterDirection.Input;
                    LastDelivery.Value = DateTime.Now;
                    SqlDataSource1.Insert();
                }
            }
    
            protected void SqlDataSource1_Inserting(object sender, SqlDataSourceCommandEventArgs e)
            {
                e.Command.Parameters.Clear();
                e.Command.Parameters.Add(Code);
                e.Command.Parameters.Add(Name);
                e.Command.Parameters.Add(Address);
                e.Command.Parameters.Add(ContactNo);
                e.Command.Parameters.Add(LastDelivery);
            }
    
    
        }
    }



    Thursday, June 15, 2017 6:17 AM

All replies

  • User-707554951 posted

    Hi NJ2

    1. Replace the TextBox in EditItemTemplate with DropDownList and Label

    2.Then you need to bind the dropdownlist  in the RowDataBound event of the ASP.Net GridView control

    Sample as below:

    https://www.aspsnippets.com/Articles/Populate-DropDownList-with-Selected-Value-in-EditItemTemplate-of-GridView-in-ASPNet.aspx

    Besides, if you wan display DropDownList in FooterTemplate, you could make use of GridView OnDataBind event to access and bind the DropDownList control inside Gridview footer template.

    Sample as below:

    https://www.aspsnippets.com/Articles/Bind-DropDownList-in-GridView-FooterTemplate-Footer-Row-in-ASPNet.aspx

    Disclaimer: This response contains a reference to a third party World Wide Web site. Microsoft is providing this information as a convenience to you. Microsoft does not control these sites and has not tested any software or information found on these sites; therefore, Microsoft cannot make any representations regarding the quality, safety, or suitability of any software or information found there. There are inherent dangers in the use of any software found on the Internet, and Microsoft cautions you to make sure that you completely understand the risk before retrieving any software from the Internet.

    Best regard

    Cathy

    Friday, June 16, 2017 2:03 AM
  • User1769015664 posted

    I have already tried the two links you provided above but I was not able to get my code to work. The 1st link does have dropdown in the grid but no footer template to insert new records. The 2nd link does have the footer template with dropdown but the grid does not if I want to edit.

    Friday, June 16, 2017 2:54 AM
  • User991499041 posted

    Hi NJ2,

    I have already tried the two links you provided above but I was not able to get my code to work. The 1st link does have dropdown in the grid but no footer template to insert new records. The 2nd link does have the footer template with dropdown but the grid does not if I want to edit.

    Please take a look at Editable GridView in ASP.NET.This article will give you an overview of how to use an asp:GridView completely, and how to use RowEditing, RowUpdating, RowDeleting, RowCommand, RowDataBound, RowCancelingEdit, and Pagination in a DataGrid. From this article, you will have a clear view of the GridView data insert, delete, and update operations.

    Regards,

    zxj

    Tuesday, June 20, 2017 9:00 AM