2011-03-07 59 views
0

我很好奇如何执行客户端过滤,其中涉及Javascript(可能不需要写入,但他是用户的浏览器将运行)。它不应该需要Ajax(尽管阿贾克斯相关的解决方案是受欢迎的)。Asp.NET中的Dropdownlist客户端过滤

我是全新的Asp.NET编程。这个例子涉及我在工作中遇到的一个问题。我已经做了很多年的基于应用程序的编程,甚至一些PHP。但是学习Asp.NET让我很难(这是我没有想到的)。

我有三个组合框。但我想根据选择的内容和可用内容(一张额外的表格)过滤掉它们的内容。

这是示例代码页。现在代码隐藏的.vb文件中只有一个空白的Page.Load()。

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

<!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>Sample Page</title> 
</head> 
<body> 
    <form id="form1" runat="server"> 
    <div> 
     <asp:XmlDataSource ID="SqlDataSource1" runat="server"> 

<%--dropdownvaluesId categoryId value code 
1 1 AndhraPradesh AP 
2 1 Tamilnadu TN 
3 2 South Carolina SC 
4 2 Tennesse TN 
5 3 Victoria Vic 
6 3 New South Wales  NSW 
--%> 
      <Data> 
       <DropdownValues> 
        <DropdownValue dropdownvaluesId="-1" categoryId="1" value="" code="Blank" /> 
        <DropdownValue dropdownvaluesId="1" categoryId="1" value="AndhraPradesh" code="AP" /> 
        <DropdownValue dropdownvaluesId="2" categoryId="1" value="Tamilnadu" code="TN" /> 
        <DropdownValue dropdownvaluesId="-1" categoryId="2" value="" code="Blank" /> 
        <DropdownValue dropdownvaluesId="3" categoryId="2" value="South Carolina" code="SC" /> 
        <DropdownValue dropdownvaluesId="4" categoryId="2" value="Tennesse" code="TN" /> 
        <DropdownValue dropdownvaluesId="-1" categoryId="3" value="" code="Blank" /> 
        <DropdownValue dropdownvaluesId="5" categoryId="3" value="Victoria" code="Vic" /> 
        <DropdownValue dropdownvaluesId="6" categoryId="3" value="New South Wales" code="NSW" /> 
        <DropdownValue dropdownvaluesId="7" categoryId="3" value="Queensland" code="QLD" /> 
       </DropdownValues> 
      </Data> 
     </asp:XmlDataSource> 

     <asp:XmlDataSource ID="SqlDataSource2" runat="server"> 

<%--categoryId Name 
1 India 
2 USA 
3 Australia 
--%> 
      <Data> 
       <DropdownCategories> 
        <DropdownCatagory categoryId="1" Name="Inda" /> 
        <DropdownCatagory categoryId="2" Name="USA" /> 
        <DropdownCatagory categoryId="3" Name="Australia" /> 
       </DropdownValues> 
      </Data> 
     </asp:XmlDataSource> 

     <asp:XmlDataSource ID="SqlDataSource3" runat="server"> 

<%---- Available Combinations -- 

india_dropdownvalueId usa_dropdownvalueId australia_dropdownvalueId 

1      3      5 
1      3      6 
1      3      5 
1      4      7 
--%> 
      <Data> 
       <AvailableCombinations> 
        <Combination india_dropdownvalueId="1" usa_dropdownvalueId="3" australia_dropdownvalueId="5" /> 
        <Combination india_dropdownvalueId="1" usa_dropdownvalueId="3" australia_dropdownvalueId="6" /> 
        <Combination india_dropdownvalueId="1" usa_dropdownvalueId="4" australia_dropdownvalueId="7" /> 
       </DropdownValues> 
      </Data> 
     </asp:XmlDataSource> 

     <asp:XmlDataSource ID="IndiaDataSource" runat="server"> 
      <Data> 
       <DropdownValues> 
        <DropdownValue dropdownvaluesId="-1" categoryId="1" value="" code="Blank" /> 
        <DropdownValue dropdownvaluesId="1" categoryId="1" value="AndhraPradesh" code="AP" /> 
        <DropdownValue dropdownvaluesId="2" categoryId="1" value="Tamilnadu" code="TN" /> 
       </DropdownValues> 
      </Data> 
     </asp:XmlDataSource> 

     <asp:XmlDataSource ID="USADataSource" runat="server"> 
      <Data> 
       <DropdownValues> 
        <DropdownValue dropdownvaluesId="-1" categoryId="2" value="" code="Blank" /> 
        <DropdownValue dropdownvaluesId="3" categoryId="2" value="South Carolina" code="SC" /> 
        <DropdownValue dropdownvaluesId="4" categoryId="2" value="Tennesse" code="TN" /> 
       </DropdownValues> 
      </Data> 
     </asp:XmlDataSource> 

     <asp:XmlDataSource ID="AustraliaDataSource" runat="server"> 
      <Data> 
       <DropdownValues> 
        <DropdownValue dropdownvaluesId="-1" categoryId="3" value="" code="Blank" /> 
        <DropdownValue dropdownvaluesId="5" categoryId="3" value="Victoria" code="Vic" /> 
        <DropdownValue dropdownvaluesId="6" categoryId="3" value="New South Wales" code="NSW" /> 
        <DropdownValue dropdownvaluesId="7" categoryId="3" value="Queensland" code="QLD" /> 
       </DropdownValues> 
      </Data> 
     </asp:XmlDataSource> 

<%--  <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>" 
      SelectCommand="SELECT [CategoryID], [Value], [Code], [dropdownValuesID] FROM [DropdownValues]"></asp:SqlDataSource> 
--%> 
     <table cellpadding="2" cellspacing="2"> 
     <tr> 
     <td><asp:Label ID="Label1" runat="server" Text="States in India"></asp:Label></td> 
     <td><asp:DropDownList ID="ddlIndia" runat="server" DataSourceID="IndiaDataSource" DataTextField="value" DataValueField="code" ColumnName="CategoryID" EmptyDataText="No Items Found" FilterBy="1" UIFriendlyText="Select State"></asp:DropDownList></td> 
     <td width="100px">&nbsp;</td> 
     <td><asp:Label ID="Label2" runat="server" Text="States in USA"></asp:Label></td> 
     <td><asp:DropDownList ID="ddlUSA" runat="server" DataSourceID="USADataSource" DataTextField="value" DataValueField="code" ColumnName="CategoryID" EmptyDataText="No Items found" FilterBy="2" UIFriendlyText="Select State"></asp:DropDownList></td>  
     <td width="100px">&nbsp;</td> 
     <td><asp:Label ID="Label3" runat="server" Text="States in Australia"></asp:Label></td> 
     <td><asp:DropDownList ID="ddlAustralia" runat="server" DataSourceID="AustraliaDataSource" DataTextField="value" DataValueField="code" ColumnName="CategoryID" EmptyDataText="No Items found" FilterBy="2" UIFriendlyText="Select State"></asp:DropDownList></td>  
     </tr> 
     </table>   
    </div> 
    </form> 
</body> 
</html> 

所以最初,只有一个项目将在ddlIndia - 安得拉邦; ddlUSA中的两件物品 - 南卡罗来纳州和田纳西州;和ddlAustralia的三件物品 - 维多利亚,新南威尔士州,昆士兰州。空白也需要填充这些下拉列表。但我不认为他们的项目。

如果您选择昆士兰州,ddlUSA需要过滤为仅允许选择田纳西或空白,并且ddlIndia需要过滤以允许选择(这是ddlIndia的默认值)AndhraPradesh或空白。

我喜欢任何链接到我可以自己学习的网站。我不是在寻找一个免费派发。这只是花了几天的时间来寻找信息,如何做到这一点的例子正在变得毫无结果。

如果需要隐藏代码,我不介意VB.NET或C#。我猜VB.NET如果你不能决定,这对你来说是最简单的。

希望有帮助,

TamusJRoyce

附:我在早上工作,所以我将在大约12个小时内再次出现。在另一天没有解决方案的情况下睡觉。 Example Project是最初代码的来源。

+0

忘记添加asp:XmlDataSource仅用于此示例。代码隐藏将填充我的真实应用程序中来自SQL查询的自定义业务对象。 – TamusJRoyce 2011-03-07 05:02:04

回答

1

尽管我鄙视ASP.NET AJAX控件工具包,但它仍然比您当前拥有的所有代码更好,包括您在页面上内嵌的SqlDataSource控件。请参阅this sample of the AJAX CascadingDropDown control

所有你需要做的(基本上)是创建一个Web服务,为客户端提供它所需要的数据,配置扩展器指向Web方法并传递相关参数,它会做你想要的是比你拥有的更少的代码/ HTML。

如果你不想使用服务器端的AJAX,你可以通过一些jQuery实现上述操作(并避免使用ViewState)。

+0

ajax方法正是我所需要的工作。我将搜索jQuery + asp.net,因为我希望三个控件始终处于启用状态,以便可以按任意顺序进行过滤。这将是很好,如果我可以在JavaScript中如何嵌入它,就像它很容易在PHP中完成。但只是设置javascript变量(每个dropdownlist持有id的一个数组,以及一个拥有允许的id组合的数组)很难。 – TamusJRoyce 2011-03-07 12:51:04

0

CascadingDropDown强制页面上的验证被关闭,所以我的客户不会允许它,如果我能够使用它(得到它的工作,但不得不删除它)。 asp:DropDownList AutoPostBack默认为false。将其设置为true允许我在选择更改时更新下拉菜单。我真的是一个菜鸟,因为错过了这个简单的事情。

<asp:DropDownList ID="DropdownVersion" AutoPostBack="true" runat="server" /> 

但是,这仍然没有得到我的方式嵌入JavaScript中的客户端,并根据任何三个下拉列表的中所做的选择,基于可用协会的隐藏收集过滤。所以任何信息将不胜感激。