ccdwithdb.aspx

AJAX 应用 实现页面的无刷新

                PromptText</span><span style="font-size: 10pt; color: blue; font-family: 'Courier New';
                    ">="Please select a model"</span><span style="font-size: 10pt; font-family: 'Courier New';
                        "></span><br/>
            <span style="font-size: 10pt; color: red; font-family: 'Courier New'; "> 
                ServiceMethod</span><span style="font-size: 10pt; color: blue; font-family: 'Courier New';
                    ">="GetModelsForMake"</span><br/>
            <span style="font-size: 10pt; font-family: 'Courier New'; "><span
                style="COLOR: #ff0000">  
            </span><span style="color: red">ServicePath</span><span
                style="color: blue">="CarsService.asmx"</span></span><br/>
            <span style="font-size: 10pt; color: red; font-family: 'Courier New'; "> 
                Category</span><span style="font-size: 10pt; color: blue; font-family: 'Courier New';
                    ">="Model"</span><span style="font-size: 10pt; font-family: 'Courier New';
                        "> <span style="color: blue">/&gt;</span></span><br/>
            <span style="font-size: 10pt; color: blue; font-family: 'Courier New'; ">&lt;<span style="color: maroon">ajaxToolkit</span><span style="color: blue">:</span><span
                        style="color: maroon">CascadingDropDown<br />
                    <span style="color: blue">  </span></span><span style="color: red">ID</span><span
                            style="color: blue">="CascadingDropDown3"<br />
                    </span><span style="color: red"><span style="color: #000"></span>  runat</span><span
                                style="color: blue">="server"</span></span><span
                                style="font-size: 10pt; font-family: 'Courier New'; "></span><br/>
            <span style="font-size: 10pt; color: red; font-family: 'Courier New'; "> 
                TargetControlID</span><span style="font-size: 10pt; color: blue; font-family: 'Courier New';
                    ">="ddlColor"</span><br/>
            <span style="font-size: 10pt; color: red; font-family: 'Courier New'; "> 
                ParentControlID</span><span style="font-size: 10pt; color: blue; font-family: 'Courier New';
                    ">="ddlModel"</span><span style="font-size: 10pt; font-family: 'Courier New';
                        "></span><br/>
            <span style="font-size: 10pt; color: red; font-family: 'Courier New'; "> 
                PromptText</span><span style="font-size: 10pt; color: blue; font-family: 'Courier New';
                    ">="Please select a color"</span><span style="font-size: 10pt; font-family: 'Courier New';
                        "></span><br/>
            <span style="font-size: 10pt; color: red; font-family: 'Courier New'; "> 
                ServiceMethod</span><span style="font-size: 10pt; color: blue; font-family: 'Courier New';
                    ">="GetColorsForModel"</span><br/>
            <span style="font-size: 10pt; color: red; font-family: 'Courier New'; "> 
                ServicePath</span><span style="font-size: 10pt; color: blue; font-family: 'Courier New';
                    ">="CarsService.asmx"</span><span style="font-size: 10pt; font-family: 'Courier New';
                        "></span><br/>
            <span style="font-size: 10pt; color: red; font-family: 'Courier New'; "> 
                Category</span><span style="font-size: 10pt; color: blue; font-family: 'Courier New';
                    ">="Color" /&gt;</span></code>
        Once you've completed your web service methods, your cascading drop down is complete!<br />
        <br />
        <p  style="margin: 0in 0in 0pt">
            Finally, in order for the values to be submitted, EventValidation needs to be disabled
            for the page. EventValidation ensures that the values in each control match
            the values that were present when the page was rendered, but since these drop downs
            are populating on the client side, this is never true.<span style="">
            </span>We抮e hoping to find a way to resolve this issue but please ensure
            that you understand the potential risks of this and validate the data appropriately
            in your post back when using this control.</p>
        <div>

        <asp:Panel ID="WebServiceCode_HeaderPanel" runat="server" style="cursor: pointer;">
            <div class="heading">
                <asp:ImageButton ID="WebServiceCode_ToggleImage" runat="server" ImageUrl="~/images/collapse.jpg" AlternateText="collapse"  /> Full WebService Code
            </div>
        </asp:Panel>
        <asp:Panel id="WebServiceCode_ContentPanel" runat="server" style="overflow:hidden;" Height="0px">

                <pre>using System;
    using System.Web;
    using System.Collections;
    using System.Collections.Generic;
    using System.Collections.Specialized;
    using System.Web.Services;
    using System.Web.Services.Protocols;
    using AjaxControlToolkit;
    using System.Data;
    using System.Data.SqlClient;

    /// &lt;summary&gt;
    /// Summary description for CarData
    /// &lt;/summary&gt;
    [WebService(Namespace = "http://tempuri.org/")]
    [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
    public class CarData : System.Web.Services.WebService
    {
      public CarData()
      {
        //Uncomment the following line if using designed components 
        //InitializeComponent(); 
      }

      [WebMethod]
      public CascadingDropDownNameValue[] GetMakes(
        string knownCategoryValues,
        string category)
      {
        CarsTableAdapters.MakeTableAdapter makeAdapter =
          new CarsTableAdapters.MakeTableAdapter();
        Cars.MakeDataTable makes = makeAdapter.GetMakes();
        List&lt;CascadingDropDownNameValue&gt; values =
          new List&lt;CascadingDropDownNameValue&gt;();
        foreach (DataRow dr in makes)
        {
          string make = (string)dr["Make"];
          int makeId = (int)dr["MakeID"];
          values.Add(new CascadingDropDownNameValue(
            make, makeId.ToString()));
        }
        return values.ToArray();
      }

      [WebMethod]
      public CascadingDropDownNameValue[] GetModelsForMake(
        string knownCategoryValues,
        string category)
      {
        StringDictionary kv =<br />      CascadingDropDown.ParseKnownCategoryValuesString(
          knownCategoryValues);
        int makeId;
        if (!kv.ContainsKey("Make") ||
            !Int32.TryParse(kv["Make"], out makeId))
        {
          return null;
        }
        CarsTableAdapters.ModelTableAdapter makeAdapter =
          new CarsTableAdapters.ModelTableAdapter();
        Cars.ModelDataTable models =
          makeAdapter.GetModelsForMake(makeId);
        List&lt;CascadingDropDownNameValue&gt; values =
          new List&lt;CascadingDropDownNameValue&gt;();
        foreach (DataRow dr in models)
        {
          values.Add(new CascadingDropDownNameValue(
            (string)dr["Model"], dr["ModelID"].ToString()));
        }
        return values.ToArray();
      }

      [WebMethod]
      public CascadingDropDownNameValue[] GetColorsForModel(
        string knownCategoryValues,
        string category)
      {
        StringDictionary kv =
          CascadingDropDown.ParseKnownCategoryValuesString(
          knownCategoryValues);
        int modelId;
        if (!kv.ContainsKey("Model") ||
            !Int32.TryParse(kv["Model"], out modelId))
        {
          return null;
        }
        CarsTableAdapters.ColorTableAdapter adapter =
          new CarsTableAdapters.ColorTableAdapter();
        Cars.ColorDataTable colorTable =
          adapter.GetColorsForModel(modelId);
        List&lt;CascadingDropDownNameValue&gt; values =
          new List&lt;CascadingDropDownNameValue&gt;();
        foreach (DataRow dr in colorTable)
        {
          values.Add(new CascadingDropDownNameValue(
            (string)dr["Color"], dr["ColorID"].ToString()));
        }
        return values.ToArray();
      }
    }</pre> 
                
        </asp:Panel>

        <ajaxToolkit:CollapsiblePanelExtender ID="demoCpe" runat="Server"
            TargetControlID="WebServiceCode_ContentPanel"
            ExpandControlID="WebServiceCode_HeaderPanel"
            CollapseControlID="WebServiceCode_HeaderPanel"
            Collapsed="True"        
            ExpandDirection="Vertical"
            ImageControlID="WebServiceCode_ToggleImage"
            ExpandedImage="~/images/collapse.jpg"
            ExpandedText="Collapse"
            CollapsedImage="~/images/expand.jpg"
            CollapsedText="Expand"
            SuppressPostBack="true" />
        </div>
    </div>
</asp:Content>