locked
Problem loading data to page with cascading drop down RRS feed

  • Question

  • User-695996974 posted

    I have a page that has a cascading drop down.  It works perfectly when I start with an empty page and populate data to save a new row in a db table.  However, when I try to load an existing row to the page, the parent is populated, but the child and cdd are not populated.  During the load, I set the ccd.selectedvalue to a valid value, but by the time the page is rendered, there is no selection. I am sure it is something simple, but just don't see it.

    Any help would be appreciated. 

    Tuesday, August 10, 2010 12:41 PM

Answers

  • User78336405 posted

    Hi,

    I will give you an example about CascadingDropDown. Hope that will help you.

    Aspx:

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="CascadingDropDown.aspx.cs"
        EnableEventValidation="false" Inherits="CascadingDropDown" %>
    
    
    <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
    </head>
    <body>
        <form id="form1" runat="server">
        <ajaxToolkit:ToolkitScriptManager EnablePartialRendering="true" runat="server" ID="ScriptManager1" />
        <div>
            <div>
                CascadingDropDown Demonstration</div>
            <table>
                <tr>
                    <td>
                        Make
                    </td>
                    <td>
                        <asp:DropDownList ID="DropDownList1" runat="server" Width="170" />
                    </td>
                </tr>
                <tr>
                    <td>
                        Model
                    </td>
                    <td>
                        <asp:DropDownList ID="DropDownList2" runat="server" Width="170" />
                    </td>
                </tr>
                <tr>
                    <td>
                        Color
                    </td>
                    <td>
                        <asp:DropDownList ID="DropDownList3" runat="server" Width="170" AutoPostBack="true"
                            OnSelectedIndexChanged="DropDownList3_SelectedIndexChanged" />
                    </td>
                </tr>
            </table>
            <br />
            <ajaxToolkit:CascadingDropDown ID="CascadingDropDown1" runat="server" TargetControlID="DropDownList1"
                Category="Make" PromptText="Please select a make" LoadingText="[Loading makes...]"
                ServicePath="CarsService.asmx" ServiceMethod="GetDropDownContents" />
            <ajaxToolkit:CascadingDropDown ID="CascadingDropDown2" runat="server" TargetControlID="DropDownList2"
                Category="Model" PromptText="Please select a model" LoadingText="[Loading models...]"
                ServicePath="CarsService.asmx" ServiceMethod="GetDropDownContents" ParentControlID="DropDownList1" />
            <ajaxToolkit:CascadingDropDown ID="CascadingDropDown3" runat="server" TargetControlID="DropDownList3"
                Category="Color" PromptText="Please select a color" LoadingText="[Loading colors...]"
                ServicePath="CarsService.asmx" ServiceMethod="GetDropDownContents" ParentControlID="DropDownList2" />
            <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional" RenderMode="inline">
                <ContentTemplate>
                    <asp:Label ID="Label1" runat="server" Text="[No response provided yet]" />
                </ContentTemplate>
                <Triggers>
                    <asp:AsyncPostBackTrigger ControlID="DropDownList3" EventName="SelectedIndexChanged" />
                </Triggers>
            </asp:UpdatePanel>
        </div>
        </form>
    </body>
    </html>


     

    Cs:

    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using System.Web.Services;
    using AjaxControlToolkit;
    using System.Collections;
    
    public partial class CascadingDropDown :Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
    
        }
        protected void DropDownList3_SelectedIndexChanged(object sender, EventArgs e)
        {
            // Get selected values
            string make = DropDownList1.SelectedItem.Text;
            string model = DropDownList2.SelectedItem.Text;
            string color = DropDownList3.SelectedItem.Text;
    
            // Output result string based on which values are specified
            if (string.IsNullOrEmpty(make))
            {
                Label1.Text = "Please select a make.";
            }
            else if (string.IsNullOrEmpty(model))
            {
                Label1.Text = "Please select a model.";
            }
            else if (string.IsNullOrEmpty(color))
            {
                Label1.Text = "Please select a color.";
            }
            else
            {
                Label1.Text = string.Format("You have chosen a {0} {1} {2}. Nice car!", color, make, model);
            }
           // Response.Write("<script>alert(1)</script>");
        }
    
        
        [WebMethod]
        [System.Web.Script.Services.ScriptMethod]
        public static CascadingDropDownNameValue[] GetDropDownContentsPageMethod(string knownCategoryValues, string category)
        {
            return new CarsService().GetDropDownContents(knownCategoryValues, category);
        }
    }


     

    Asmx:

    // (c) Copyright Microsoft Corporation.
    // This source is subject to the Microsoft Public License.
    // See http://www.microsoft.com/opensource/licenses.mspx#Ms-PL.
    // All other rights reserved.
    
    
    using System;
    using System.Collections.Specialized;
    using System.Text.RegularExpressions;
    using System.Web;
    using System.Web.Services;
    using System.Xml;
    
    /// <summary>
    /// Helper web service for CascadingDropDown sample
    /// </summary>
    [WebService(Namespace = "http://tempuri.org/")]
    [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
    [System.Web.Script.Services.ScriptService]
    public class CarsService : WebService
    {
        // Member variables
        private static XmlDocument _document;
        private static Regex _inputValidationRegex;
        private static object _lock = new object();
    
        // we make these public statics just so we can call them from externally for the
        // page method call
        public static XmlDocument Document
        {
            get
            {
                lock (_lock)
                {
                    if (_document == null)
                    {
                        // Read XML data from disk
                        _document = new XmlDocument();
                        _document.Load(HttpContext.Current.Server.MapPath("~/App_Data/CarsService.xml"));
                    }
                }
                return _document;
            }
        }
    
        public static string[] Hierarchy
        {
            get { return new string[] { "make", "model" }; }
        }
    
        public static Regex InputValidationRegex
        {
            get
            {
                lock (_lock)
                {
                    if (null == _inputValidationRegex)
                    {
                        _inputValidationRegex = new Regex("^[0-9a-zA-Z \\(\\)]*$");
                    }
                }
                return _inputValidationRegex;
            }
        }
    
        /// <summary>
        /// Helper web service method
        /// </summary>
        /// <param name="knownCategoryValues">private storage format string</param>
        /// <param name="category">category of DropDownList to populate</param>
        /// <returns>list of content items</returns>
        [WebMethod]
        public AjaxControlToolkit.CascadingDropDownNameValue[] GetDropDownContents(string knownCategoryValues, string category)
        {
            // Get a dictionary of known category/value pairs
            StringDictionary knownCategoryValuesDictionary = AjaxControlToolkit.CascadingDropDown.ParseKnownCategoryValuesString(knownCategoryValues);
    
            // Perform a simple query against the data document
            return AjaxControlToolkit.CascadingDropDown.QuerySimpleCascadingDropDownDocument(Document, Hierarchy, knownCategoryValuesDictionary, category, InputValidationRegex);
        }
    }


     

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Monday, August 16, 2010 5:13 AM

All replies

  • User-695996974 posted

    I continued to work with this and foudn that if I set the  dropdownlist selectect value equal to the cascading dropdown selected value and the display shows properly.  Does not seem like that should be required. 

    Now, when I try to update the data to the db (from click event of a button), the selected value of both the ccd or ddl are equal "".  How can I retrieve the value that was originally in the db, if the user does not change that value?

    Tuesday, August 10, 2010 2:36 PM
  • User78336405 posted

    Hi,

    I will give you an example about CascadingDropDown. Hope that will help you.

    Aspx:

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="CascadingDropDown.aspx.cs"
        EnableEventValidation="false" Inherits="CascadingDropDown" %>
    
    
    <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
    </head>
    <body>
        <form id="form1" runat="server">
        <ajaxToolkit:ToolkitScriptManager EnablePartialRendering="true" runat="server" ID="ScriptManager1" />
        <div>
            <div>
                CascadingDropDown Demonstration</div>
            <table>
                <tr>
                    <td>
                        Make
                    </td>
                    <td>
                        <asp:DropDownList ID="DropDownList1" runat="server" Width="170" />
                    </td>
                </tr>
                <tr>
                    <td>
                        Model
                    </td>
                    <td>
                        <asp:DropDownList ID="DropDownList2" runat="server" Width="170" />
                    </td>
                </tr>
                <tr>
                    <td>
                        Color
                    </td>
                    <td>
                        <asp:DropDownList ID="DropDownList3" runat="server" Width="170" AutoPostBack="true"
                            OnSelectedIndexChanged="DropDownList3_SelectedIndexChanged" />
                    </td>
                </tr>
            </table>
            <br />
            <ajaxToolkit:CascadingDropDown ID="CascadingDropDown1" runat="server" TargetControlID="DropDownList1"
                Category="Make" PromptText="Please select a make" LoadingText="[Loading makes...]"
                ServicePath="CarsService.asmx" ServiceMethod="GetDropDownContents" />
            <ajaxToolkit:CascadingDropDown ID="CascadingDropDown2" runat="server" TargetControlID="DropDownList2"
                Category="Model" PromptText="Please select a model" LoadingText="[Loading models...]"
                ServicePath="CarsService.asmx" ServiceMethod="GetDropDownContents" ParentControlID="DropDownList1" />
            <ajaxToolkit:CascadingDropDown ID="CascadingDropDown3" runat="server" TargetControlID="DropDownList3"
                Category="Color" PromptText="Please select a color" LoadingText="[Loading colors...]"
                ServicePath="CarsService.asmx" ServiceMethod="GetDropDownContents" ParentControlID="DropDownList2" />
            <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional" RenderMode="inline">
                <ContentTemplate>
                    <asp:Label ID="Label1" runat="server" Text="[No response provided yet]" />
                </ContentTemplate>
                <Triggers>
                    <asp:AsyncPostBackTrigger ControlID="DropDownList3" EventName="SelectedIndexChanged" />
                </Triggers>
            </asp:UpdatePanel>
        </div>
        </form>
    </body>
    </html>


     

    Cs:

    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using System.Web.Services;
    using AjaxControlToolkit;
    using System.Collections;
    
    public partial class CascadingDropDown :Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
    
        }
        protected void DropDownList3_SelectedIndexChanged(object sender, EventArgs e)
        {
            // Get selected values
            string make = DropDownList1.SelectedItem.Text;
            string model = DropDownList2.SelectedItem.Text;
            string color = DropDownList3.SelectedItem.Text;
    
            // Output result string based on which values are specified
            if (string.IsNullOrEmpty(make))
            {
                Label1.Text = "Please select a make.";
            }
            else if (string.IsNullOrEmpty(model))
            {
                Label1.Text = "Please select a model.";
            }
            else if (string.IsNullOrEmpty(color))
            {
                Label1.Text = "Please select a color.";
            }
            else
            {
                Label1.Text = string.Format("You have chosen a {0} {1} {2}. Nice car!", color, make, model);
            }
           // Response.Write("<script>alert(1)</script>");
        }
    
        
        [WebMethod]
        [System.Web.Script.Services.ScriptMethod]
        public static CascadingDropDownNameValue[] GetDropDownContentsPageMethod(string knownCategoryValues, string category)
        {
            return new CarsService().GetDropDownContents(knownCategoryValues, category);
        }
    }


     

    Asmx:

    // (c) Copyright Microsoft Corporation.
    // This source is subject to the Microsoft Public License.
    // See http://www.microsoft.com/opensource/licenses.mspx#Ms-PL.
    // All other rights reserved.
    
    
    using System;
    using System.Collections.Specialized;
    using System.Text.RegularExpressions;
    using System.Web;
    using System.Web.Services;
    using System.Xml;
    
    /// <summary>
    /// Helper web service for CascadingDropDown sample
    /// </summary>
    [WebService(Namespace = "http://tempuri.org/")]
    [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
    [System.Web.Script.Services.ScriptService]
    public class CarsService : WebService
    {
        // Member variables
        private static XmlDocument _document;
        private static Regex _inputValidationRegex;
        private static object _lock = new object();
    
        // we make these public statics just so we can call them from externally for the
        // page method call
        public static XmlDocument Document
        {
            get
            {
                lock (_lock)
                {
                    if (_document == null)
                    {
                        // Read XML data from disk
                        _document = new XmlDocument();
                        _document.Load(HttpContext.Current.Server.MapPath("~/App_Data/CarsService.xml"));
                    }
                }
                return _document;
            }
        }
    
        public static string[] Hierarchy
        {
            get { return new string[] { "make", "model" }; }
        }
    
        public static Regex InputValidationRegex
        {
            get
            {
                lock (_lock)
                {
                    if (null == _inputValidationRegex)
                    {
                        _inputValidationRegex = new Regex("^[0-9a-zA-Z \\(\\)]*$");
                    }
                }
                return _inputValidationRegex;
            }
        }
    
        /// <summary>
        /// Helper web service method
        /// </summary>
        /// <param name="knownCategoryValues">private storage format string</param>
        /// <param name="category">category of DropDownList to populate</param>
        /// <returns>list of content items</returns>
        [WebMethod]
        public AjaxControlToolkit.CascadingDropDownNameValue[] GetDropDownContents(string knownCategoryValues, string category)
        {
            // Get a dictionary of known category/value pairs
            StringDictionary knownCategoryValuesDictionary = AjaxControlToolkit.CascadingDropDown.ParseKnownCategoryValuesString(knownCategoryValues);
    
            // Perform a simple query against the data document
            return AjaxControlToolkit.CascadingDropDown.QuerySimpleCascadingDropDownDocument(Document, Hierarchy, knownCategoryValuesDictionary, category, InputValidationRegex);
        }
    }


     

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Monday, August 16, 2010 5:13 AM
  • User-784088055 posted

    thanks song -tian.

    but, I want to know how they are declaring all the properties name and how they are calinng the web service?

    Means

     <ajaxToolkit:CascadingDropDown ID="CascadingDropDown1" runat="server" TargetControlID="DropDownList1" 
               
    Category="Make" PromptText="Please select a make" LoadingText="[Loading makes...]" 
               
    ServicePath="CarsService.asmx" ServiceMethod="GetDropDownContents" /> 
     

    here they are declaring category, servicepath, loading text, promt text etc. How they are defining those properties? I can use Cascading Dropdown but want to know if I want to create new toolkit how to do?

    In the example which is posteed in the site that is without any webservice and without creating new properties.

    But I want to know much details on it.

    Thursday, April 14, 2011 11:04 PM