帮酷LOGO
0 0 评论
文章标签:Cascading  GRID  Gridview  dropdownlist  CAS  


介绍

前面我们使用Ajax和java-script来实现这类任务,但是现在在 Ajax control-toolkit控件中提供了相同的功能,即级联Drop-down控件。 本文介绍以下几点:

  • 网格内的Ajax级联 drop-down List 绑定。
  • 如何设置级联控件的属性。
  • 页 load.How 重新绑定后。

背景

你也可以遵循这个 Cascading-Dropdownlist知道这个 control.Some的基本特征和基本属性的特性 List 下面:

  • - Drop-Down List 要填充的ID。
  • 类别 - 这里 Drop-Down List 表示的类别的名称。
  • PromptText - 在用户从DropDownList中选择值之前显示的可选文本。
  • PromptValue - 显示Prompt-text时设置的可选值。
  • EmptyText - Drop-Down List 没有数据可以显示时显示的可选文本。
  • EmptyValue - 显示Empty-text时设置的可选值。
  • LoadingText - 在加载 Drop-Down List的数据时显示的可选文本。
  • ServicePath - 返回用于填充Drop-DownList的数据的web服务的路径。 如果ServiceMethod引用页方法,则这里属性应为空。 web服务应该用 System.Web. Script.Services.ScriptService 属性装饰。
  • ServiceMethod - Web服务方法,返回用于填充DropDownList的数据。
  • ContextKey - 用户/页特定的上下文提供给 ServiceMethod/ServicePath描述的web方法的可选重载。 如果使用上下文键,它应该具有与类型为string的额外参数相同的签名。
  • UseContextKey - 是否应使用ContextKey属性。 如果ContextKey属性设置为( 在客户端或者服务器上),将自动启用这里选项。
  • ParentControlID - 控制这里控件内容的父DropDownList的可选 ID。
  • SelectedValue - 默认选择的可选值。 这需要精确匹配DropDownList中值的字符串表示形式。

使用代码

我要创建一个网格视图控制在我的web page.I 放置两个drop-downlist和两个级联控制在我的网格。

客户端代码:

<asp:GridView GridLines="Vertical" ID="grdDemo" runat="server" AutoGenerateColumns="False" BackColor="White" BorderColor="#DEDFDE" BorderStyle="None" BorderWidth="1px" CellPadding="4" ForeColor="Black" OnRowDataBound="grdDemo_RowDataBound" OnRowDeleting="grdDemo_RowDeleting">
 <EmptyDataTemplate>
 <div>
 No record found</div>
 </EmptyDataTemplate>
 <AlternatingRowStyle BackColor="White"/>
 <Columns>
 <asp:TemplateField HeaderText="Brand Name">
 <ItemTemplate>
 <asp:DropDownList ID="ddlBrand" runat="server" Font-Size="9" Width="130">
 </asp:DropDownList>
 <ajaxToolKit:CascadingDropDown UseContextKey="true" ContextKey='<%# Bind("BrandId") %>' ID="ccdRegion" runat="server" Category="BrandName" TargetControlID="ddlBrand" ServiceMethod="GetAllCarBrand" ServicePath="~/WebService/CarService.asmx">
 </ajaxToolKit:CascadingDropDown>
 </ItemTemplate>
 </asp:TemplateField>
 <asp:TemplateField HeaderText="Model Name">
 <ItemTemplate>
 <asp:DropDownList ID="ddlModelName" runat="server" Font-Size="9" Width="130">
 </asp:DropDownList>
 <ajaxToolKit:CascadingDropDown UseContextKey="true" ContextKey='<%# Bind("ModelId") %>' ID="ccdDistrict" runat="server" Category="Model" ParentControlID="ddlBrand" TargetControlID="ddlModelName" ServiceMethod="GetAllModelByBrand" ServicePath="~/WebService/CarService.asmx">
 </ajaxToolKit:CascadingDropDown>
 </ItemTemplate>
 </asp:TemplateField>
 <asp:TemplateField>
 <ItemTemplate>
 <asp:Button ID="BtnAdd" Text="Add" runat="server" OnClick="BtnAdd_Click"/>
 <asp:Button ID="BtnDelete" Visible="false" Text="Delete" CommandName="Delete" runat="server"/>
 </ItemTemplate>
 </asp:TemplateField>
 </Columns>
 <FooterStyle BackColor="#CCCC99"/>
 <HeaderStyle BackColor="#6B696B" Font-Bold="True" ForeColor="White"/>
 <PagerStyle BackColor="#F7F7DE" ForeColor="Black" HorizontalAlign="Right"/>
 <RowStyle BackColor="#F7F7DE"/>
 <SelectedRowStyle BackColor="#CE5D5A" Font-Bold="True" ForeColor="White"/>
 <SortedAscendingCellStyle BackColor="#FBFBF2"/>
 <SortedAscendingHeaderStyle BackColor="#848384"/>
 <SortedDescendingCellStyle BackColor="#EAEAD3"/>
 <SortedDescendingHeaderStyle BackColor="#575357"/>
 </asp:GridView>

创建一个 client-side page.I 上的网格之后,将创建一个名为 CarService.asmx web服务。 在这个web服务,我已经创建了两个方法来绑定这些 drop-down List 控制命名为 GetAllCarBrandGetAllModelByBrand

这些方法返回的数组 CascadingDropDownNameajax提供的价值类Control-toolkit图书馆。 List的汽车品牌,这些品牌的基础上,它将返回汽车模型名称,像Maruti品牌名称和 Swift 汽车 model.I 恒定值用来填补我 list.In 三个参数应该定义web服务方法。

  • 类别: 表示dropdownlist的类别的名称。
  • KnownCategoryValues: 这个参数将返回一个包含当前所选类别值的字符串,以及检索 for.So 值的类别,我们可以很容易地找到父控件的值。
  • 上下文键: 用于绑定选择值。可以使用这里上下文键重新绑定已经选择的dropdownlist值。

Web服务代码如下:

///<summary>/// Summary description for CarService///</summary>[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.ComponentModel.ToolboxItem(false)]// To allow this Web Service to be called from script, using ASP.NET AJAX, uncomment the following line. [System.Web.Script.Services.ScriptService]publicclass <var> CarService </var>: System.Web.Services.WebService
{
 #region Public Member Declare Hereprivate List<CascadingDropDownNameValue> ListCascading;
 #endregion///<summary>/// Gets all car brand.///</summary>///<paramname="knownCategoryValues">The known category values.</param>///<paramname="category">The category.</param>///<paramname="contextKey">The context key.</param>///<returns></returns> [WebMethod]
 public CascadingDropDownNameValue[] GetAllCarBrand(string knownCategoryValues, string category, string contextKey)
 {
 try {
 ListCascading = new List<CascadingDropDownNameValue>();
 List<CarBrand> LstBrand = new List<CarBrand>();
 LstBrand.Add(new CarBrand() { BrandId = 1, BrandName = "BMW" });
 LstBrand.Add(new CarBrand() { BrandId = 2, BrandName = "Maruti" });
 LstBrand.Add(new CarBrand() { BrandId = 3, BrandName = "Audi" });
 LstBrand.Add(new CarBrand() { BrandId = 4, BrandName = "Ford" });
 foreach (var item in LstBrand)
 {
 string brandId = item.BrandId.ToString();
 string brandName = item.BrandName;
 ListCascading.Add(new CascadingDropDownNameValue(brandName, brandId));
 }
 CascadingDropDownNameValue selectedVal = (from x in ListCascading where x.value == contextKey select x).FirstOrDefault();
 if (selectedVal!= null)
 selectedVal.isDefaultValue = true;
 return ListCascading.ToArray();
 }
 catch (SoapException)
 {
 throw;
 }
 catch (Exception)
 {
 throw;
 }
 }
 ///<summary>/// Gets all model by brand.///</summary>///<paramname="knownCategoryValues">The known category values.</param>///<paramname="category">The category.</param>///<paramname="contextKey">The context key.</param>///<returns></returns> [WebMethod]
 public CascadingDropDownNameValue[] GetAllModelByBrand(string knownCategoryValues, string category, string contextKey)
 {
 try {
 ListCascading = new List<CascadingDropDownNameValue>();
 //Find the selected value of brand StringDictionary brandDetails = AjaxControlToolkit.CascadingDropDown.ParseKnownCategoryValuesString(knownCategoryValues);
 var brandId = Convert.ToInt64(brandDetails["BrandName"]);
 var LstOfCarModel = GetListOfModel().Where(u=>u.BrandId == brandId) ;
 foreach (var item in LstOfCarModel)
 {
 string modelId = item.ModelId.ToString();
 string modelName = item.CarName;
 ListCascading.Add(new CascadingDropDownNameValue(modelName, modelId));
 }
 //Select the Selected value of Dropdown list. CascadingDropDownNameValue selectedVal = (from x in ListCascading where x.value == contextKey select x).FirstOrDefault();
 if (selectedVal!= null)
 selectedVal.isDefaultValue = true;
 return ListCascading.ToArray();
 }
 catch (SoapException)
 {
 throw;
 }
 catch (Exception)
 {
 throw;
 }
 }

GetAllCarBrand返回mulitiple汽车品牌和方法名称的List GetAllModelByBrand返回汽车模型的基础上自己的品牌。

在创建web服务设置属性的层叠 drop-down List grid.I 内所做的这些事情在我的客户机代码。

CascadingDropDown 类具有用于解包类别值的helper 方法: <span style="color: teal; font-family:"Courier New"; font-size: 10pt;"></span><span style="font-family:"Courier New"; font-size: 10pt;"></span>

StringDictionary brandDetails = AjaxControlToolkit.CascadingDropDown.ParseKnownCategoryValuesString(knownCategoryValues); 

这里方法将返回一个包含当前选定值的名称/值对的StringDictionary。

这是我 C# 类,这个类包含一个方法从 List 汽车模型绑定一个网格称为 CarList。我也使用 grdDemo_RowDeleting事件 delete 网格行和 grdDemo_RowDataBound事件保持显示数据表格的添加和 delete 在很行控制。

public partial class Default : System.Web.UI.Page
 {
 #region Define Member Variable Herestatic List<CarList> Staticlist;
 #endregion///<summary>/// Handles the Load event of the Page control.///</summary>///<paramname="sender">The source of the event.</param>///<paramname="e">The <seecref="System.EventArgs"/> instance containing the event data.</param>protectedvoid Page_Load(object sender, EventArgs e)
 {
 if (!IsPostBack)
 {
 BindGrid();
 }
 }
 ///<summary>/// Binds the grid.///</summary>privatevoid BindGrid()
 {
 if (Staticlist == null)
 {
 Staticlist = new List<CarList>();
 Staticlist.Add(new CarList());
 }
 grdDemo.DataSource = Staticlist;
 grdDemo.DataBind();
 }
 ///<summary>/// Handles the Click event of the BtnAdd control.///</summary>///<paramname="sender">The source of the event.</param>///<paramname="e">The <seecref="System.EventArgs"/> instance containing the event data.</param>protectedvoid BtnAdd_Click(object sender, EventArgs e)
 {
 FillExistingValue();
 Staticlist.Add(new CarList());
 BindGrid();
 }
 ///<summary>/// Fills the existing value.///</summary>privatevoid FillExistingValue()
 {
 for (int i = 0; i <grdDemo.Rows.Count; i++)
 {
 Staticlist[i].BrandId = Convert.ToInt32(((DropDownList)grdDemo.Rows[i].FindControl("ddlBrand")).SelectedItem.Value);
 Staticlist[i].ModelId = Convert.ToInt32(((DropDownList)grdDemo.Rows[i].FindControl("ddlModelName")).SelectedItem.Value);
 }
 }
 ///<summary>/// Handles the RowDeleting event of the grdDemo control.///</summary>///<paramname="sender">The source of the event.</param>///<paramname="e">The <seecref="System.Web.UI.WebControls.GridViewDeleteEventArgs"/> instance containing the event data.</param>protectedvoid grdDemo_RowDeleting(object sender, GridViewDeleteEventArgs e)
 {
 Staticlist.RemoveAt(e.RowIndex);
 BindGrid();
 }
 ///<summary>/// Handles the RowDataBound event of the grdDemo control.///</summary>///<paramname="sender">The source of the event.</param>///<paramname="e">The <seecref="System.Web.UI.WebControls.GridViewRowEventArgs"/> instance containing the event data.</param>protectedvoid grdDemo_RowDataBound(object sender, GridViewRowEventArgs e)
 {
 if (e.Row.RowType == DataControlRowType.DataRow)
 {
 var BtnAdd = ((Button)e.Row.FindControl("BtnAdd"));
 var BtnDel = ((Button)e.Row.FindControl("BtnDelete"));
 if (e.Row.RowIndex == Staticlist.Count - 1)
 {
 BtnAdd.Visible = true;
 BtnDel.Visible = false;
 }
 else {
 BtnAdd.Visible = false;
 BtnDel.Visible = true;
 }
 }
 }
 }

我希望本文能帮助你将整个代码与本文联系起来。 下面给出了演示网格的final 视图。

yf_terminology_Points of Interest@#@#@#兴趣点_yf_terminology

这是一个很好的特性由ajax控件工具包提供。首先,我试着用jquery一样,有点困难在jquery来处理客户端和服务器端页面后你将失去客户端值 postback. You 必须编写大量的客户端代码来维护这些类型的情况。 控件将代码最小化,并提供了更灵活的处理页面回发和事件的灵活性,例如我在演示网格添加和 Delete 按钮中拥有的

结束语

有关源代码的详细信息,请从本文顶部的链接下载源代码。 源代码简单且注释良好。

希望本教程有用。



文章标签:GRID  Gridview  CAS  dropdownlist  Cascading  

Copyright © 2011 HelpLib All rights reserved.    知识分享协议 京ICP备05059198号-3  |  如果智培  |  酷兔英语