AutoCompleteBox with JavaScript Array

5 posts, 1 answers
  1. Nikhil
    Nikhil avatar
    9 posts
    Member since:
    Jun 2012

    Posted 24 Dec 2015 Link to this post

    Hi,

    Please suggest how can I bind Javascript array as a datasource of AutoCompleteBox.

  2. Viktor Tachev
    Admin
    Viktor Tachev avatar
    1488 posts

    Posted 25 Dec 2015 Link to this post

    Hello,

    If you would like to bind the RadAutoCompleteBox on the client-side you can use one of the approaches illustrated below. You can bind the control to a WebService or to a RadClientDataSource control.



    Regards,
    Viktor Tachev
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Nikhil
    Nikhil avatar
    9 posts
    Member since:
    Jun 2012

    Posted 28 Dec 2015 in reply to Viktor Tachev Link to this post

    Thanks Viktor for your reply. As I have seen in documentations. I have not found any Javascript funtion so that i can use JavaScript array as a datasource for RadAutoCompleteBox. I have found only server side binding for RadAutoCompleteBox  and I have found a javascript function "set_dataSource(array)" but it is working for RadListView, RadGridView but not for RadAutoCompleteBox.

    Please suggest, I am still searching.

  5. Answer
    Viktor Tachev
    Admin
    Viktor Tachev avatar
    1488 posts

    Posted 29 Dec 2015 Link to this post

    Hi Nikhil,

    The RadAutoCompleteBox does not provide the set_dataSource() client- side method. If you would like to bind a RadAutoCompleteBox control to a JavaScript array you can use the RadClientDataSource control as mediator.

    Markup:

    <telerik:RadAutoCompleteBox runat="server" ID="RadAutoComplete1" ClientDataSourceID="RadClientDataSource1" DataTextField="value" DataValueField="id"></telerik:RadAutoCompleteBox>
     
    <telerik:RadClientDataSource runat="server" ID="RadClientDataSource1"></telerik:RadClientDataSource>

    JavaScript:

    function pageLoad() {
     
        var data = [
            {
                "id": 1,
                "value": "item 1"
            },
            {
                "id": 2,
                "value": "item 2"
            },
            {
                "id": 3,
                "value": "item 3"
            }
        ];
     
        var dataSource = $find("<%= RadClientDataSource1.ClientID %>");
     
        dataSource.set_data(data);
        dataSource.fetch();
    }


    Moreover, with this approach a possible migration would be easier if you decide to get the data from a WebService at a later stage.


    Regards,
    Viktor Tachev
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  6. Nikhil
    Nikhil avatar
    9 posts
    Member since:
    Jun 2012

    Posted 29 Dec 2015 in reply to Viktor Tachev Link to this post

    Thanks Viktor, Above is the code, i was searching for :)
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017