2

My requirement is I have 2 controls Code and description, when I select the code description will automatically displays and I want to select multiple codes automatically display multiple descriptions in description control and vice versa.

For this scenario I am supposed to use "auto complete box" using page methods, for the first time I am using Telerik controls.

Now I am able to get Codes in code auto complete box and able to select multiple codes.

Now my question is how to select the description after selecting multiple codes using Java script/jQuery?

My code is like below

<telerik:RadAutoCompleteBox ID="RdAutoClassCode" runat="server" Width="150" DropDownHeight="150"
            DropDownWidth="150" TokensSettings-AllowTokenEditing="True" OnClientTextChanged="OnClientChange" on>
            <WebServiceSettings Method="GetISOCodesRadCombobox" Path="GetClassCodeAndDescription.aspx" />
        </telerik:RadAutoCompleteBox>

 function OnClientChange() {
        debugger;
        alert("Hi");
       }

Text changed event is not firing using above code.

Please provide any sample for this?

Thanks in advance,
Srividya

4

2 回答 2

1

我终于得到了解决方案。

<telerik:RadAutoCompleteBox ID="RdAutoClassCode" runat="server" Width="150" DropDownHeight="70"
            OnClientEntryRemoved="RemoveEntry" OnClientEntryAdded="addNewEntry" height="150" DropDownWidth="150"
            TokensSettings-AllowTokenEditing="True">
            <WebServiceSettings Method="GetISOCodesRadCombobox" Path="GetClassCodeAndDescription.aspx" />
        </telerik:RadAutoCompleteBox>

<telerik:RadAutoCompleteBox ID="RdAutoClassDesc" runat="server" Width="150" DropDownHeight="70"
            height="150" DropDownWidth="150" TokensSettings-AllowTokenEditing="True">
            <WebServiceSettings Method="GetISOCodeDescriptionsRadCombobox" Path="GetClassCodeAndDescription.aspx" />
        </telerik:RadAutoCompleteBox>

网络方法：

[WebMethod]
    public static AutoCompleteBoxData GetISOCodesRadCombobox(object context)
    {
        string searchString = ((Dictionary<string, object>)context)["Text"].ToString();
        DataTable data = GetData(searchString, 0);
        List<AutoCompleteBoxItemData> result = new List<AutoCompleteBoxItemData>();

        foreach (DataRow row in data.Rows)
        {
            AutoCompleteBoxItemData childNode = new AutoCompleteBoxItemData();
            childNode.Text = row["CodeNumber"].ToString();
            childNode.Value = row["CodeNumber"].ToString();
            result.Add(childNode);
        }

        AutoCompleteBoxData res = new AutoCompleteBoxData();
        res.Items = result.ToArray();

        return res;
    }



[WebMethod]
    public static AutoCompleteBoxData GetISOCodeDescriptionsRadCombobox(object context)
    {
        string searchString = ((Dictionary<string, object>)context)["Text"].ToString();
        DataTable data = GetData(searchString, 1);
        List<AutoCompleteBoxItemData> result = new List<AutoCompleteBoxItemData>();

        foreach (DataRow row in data.Rows)
        {
            AutoCompleteBoxItemData childNode = new AutoCompleteBoxItemData();
            childNode.Text = row["CodeDesc"].ToString();
            childNode.Value = row["CodeDesc"].ToString();
            result.Add(childNode);
        }
        AutoCompleteBoxData res = new AutoCompleteBoxData();
        res.Items = result.ToArray();
        return res;
    }


    private static DataTable GetData(string text, int Value)
    {
        SqlConnection con = new SqlConnection(ConfigurationManager.AppSettings["QMSDBCON"]);
        DataSet ds = SqlHelper.ExecuteDataset(con, "usp_GetIsoCode", text, Value);
        DataTable data = new DataTable();
        // adapter.Fill(data);
        data = ds.Tables[0];
        return data;
    }

JavaScript 调用新条目：

function addNewEntry() {
        debugger;
        var autoCompleteBoxCode = $find("<%= RdAutoClassCode.ClientID %>");
        var autoCompleteBoxDescription = $find("<%= RdAutoClassDesc.ClientID %>");
        var entriesCount = autoCompleteBoxCode.get_entries().get_count();
        var entry = new Telerik.Web.UI.AutoCompleteBoxEntry();
        autoCompleteBoxDescription.get_entries().clear();

        for (var i = 0; i < entriesCount; i++) {
            var code = autoCompleteBoxCode.get_entries().getEntry(i).get_text();
            _ClassCodeSelectedIndexChanged(code);
        }
    }

使用 Json 调用服务器方法

function _ClassCodeSelectedIndexChanged(code) {
        debugger;
        var URL = window.location.protocol + "//" + window.location.host;
        URL = URL + "/GetClassCodeAndDescription.aspx/GetISOCodesRadComboboxData";
        $(document).ready(function () {
            $.ajax({
                type: "POST",
                url: URL,
                data: "{Code : '" + code + "'}",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (msg) {
                    onsuccess(msg);
                },
                error: function (xhr) {
                    onerror(xhr);
                }
            });
        });
    }
于 2013-09-25T11:03:45.817 回答
0 
jQuery("#textbox").blur(function() {
  ajaxFunction(jQuery("#textbox").val());
});

function ajaxFunction(code){
// Your ajax call
}

试试这个希望完全有帮助。

于 2013-09-19T17:02:52.270 回答