Cascading Data from single table

Question

4.20/5 (3 votes)

See more:

Cascading Data from single table with 3 Dropdownlists

[Source] [ System ] [ SourceTag ]

[0-3211-TK-1] [PHT] [ SYSTEM DRAIN ]
[0-3211-TK-2] [ MOD] [ PCP BOWL DRAIN]
[2-3371-TK-3] [PHT] [ PHT LEAKAGE ]
[1-IX VENT ] [MOD ] [ IX VENT]

according to above table i made 3 dropdownlists(ddlSystem,ddlSource,ddlS_tag)
here i wants to cascade abov 3 fields Source,System,SourceTag.

if i select System= PHT and the next dropdownlist shows SourceTag=SYSTEM DRAIN, PHT LEAKAGE, and SourceTag i select SYSTEM DRAIN= 0-3211-TK-1 like that,
how i can cascade above table data without using postpack.. piz tell anyone...

Posted 26-Dec-13 22:42pm

sharat naik

Updated 26-Dec-13 22:46pm

v2

Add a Solution

Comments

Sampath Lokuge 27-Dec-13 4:56am

For that you have to use jQuery or KnockoutJs.

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

pallelokanathareddy · Accepted Answer · 2013-12-26T23:21:00

use the below code i think it will be helpful for you. i have given the code to the simialr situation ( where user selects an item in dropdownlist and populating another dropdown values )

public partial class JQ_JSON_AJAX : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
List<string> lstCountries = new List<string>();
lstCountries.Add("--select--");
lstCountries.Add("India");
lstCountries.Add("USA");
lstCountries.Add("Canada");
ddlCountries.DataSource = lstCountries;
ddlCountries.DataBind();
}
}
[WebMethod]
public static List<string> GetStates(string countryname)
{
List<string> lstStates = new List<string>();
if (countryname.ToLower() == "usa")
{
lstStates.Add("Newyork");
lstStates.Add("texax");
lstStates.Add("ohio");
}
if (countryname.ToLower() == "india")
{
lstStates.Add("KA");
lstStates.Add("TN");
lstStates.Add("KL");
}
return lstStates;
}
}

XML

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="JQ_JSON_AJAX.aspx.cs" Inherits="JQ_JSON_AJAX" %>

<!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>
    <script src="JquryLib.js"></script>
    <script language="javascript" type="text/javascript">
        function fnPopulateStates() {
            debugger;
            var country=$("#ddlCountries").val();
            GetStates(country);
            return false;
        }
        function GetStates(countryname) {

            var v1 = 'countryname:' + "'"+countryname+"'";
            $.ajax(
         {
             type: "POST",
             url: 'JQ_JSON_AJAX.aspx/GetStates',
             data: '{' + v1 + '}',
             contentType: "application/json; charset=utf-8",
             dataType: "json",
             success: function (result) {
                     fnDisplayStates(result);
             },
             error: function (req, status, error) {
                 alert("Sorry! Post failed due to error");
             }
         });
     }
     function fnDisplayStates(data) {
         $("#ddlStates").empty();
            for (i = 0; i < data.d.length; i++) {
                var option = '<option>' + data.d[i].toString() + '</option>';
                $("#ddlStates").append(option);
            }
            return false;
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    Country:<asp:DropDownList ID="ddlCountries" onchange="return fnPopulateStates()" runat="server"></asp:DropDownList><br />
    States:<asp:DropDownList ID="ddlStates" runat="server"></asp:DropDownList>

    </div>
    </form>
</body>
</html>

Note : download jquery file from jquery.com website
for more details related to best c# interview questions and answers visit http://skillgun.com/csharp/interview-questions-and-answers[^]