This is a migrated thread and some comments may be shown as answers.

http://demos.kendoui.com/web/autocomplete/template.html

6 Answers 35 Views
AutoComplete
This is a migrated thread and some comments may be shown as answers.
Jnchaves
Top achievements
Rank 1
Jnchaves asked on 09 Nov 2013, 11:12 AM
Hi,
  I see how you are reading the data. How can I use the onclick method to go to another site related to the person I select? I would add the site link in the Json of course.

Thanks,
Amin

6 Answers, 1 is accepted

Sort by
0
Alexander Valchev
Telerik team
answered on 11 Nov 2013, 03:29 PM
Hi Amin,

If I understood you would like to open a link in a new tab/window when user selects item from the AutoComplete. If that is the case please check this sample:
(hint: the autocomplete have two items - Google and Bing)

Regards,
Alexander Valchev
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Jnchaves
Top achievements
Rank 1
answered on 11 Nov 2013, 04:02 PM
You are awesome.. Exactly what I wanted.
0
Jnchaves
Top achievements
Rank 1
answered on 11 Nov 2013, 08:18 PM
Hi,
  I attempted to move the data into JSON file. No Success. Can you help me look at the code below?


<!DOCTYPE html>
<html>
<head>
    <title>KendoUI Test Page</title>
    
    <link href="http://cdn.kendostatic.com/2013.2.918/styles/kendo.common.min.css" rel="stylesheet" />
    <link href="http://cdn.kendostatic.com/2013.2.918/styles/kendo.default.min.css" rel="stylesheet" />
    <link href="http://cdn.kendostatic.com/2013.2.918/styles/kendo.dataviz.min.css" rel="stylesheet" />

    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="http://cdn.kendostatic.com/2013.2.918/js/kendo.all.min.js"></script>
</head>
<body>
   <input id="autocomplete" type="text" />
<!--    <script>
        $("#autocomplete").kendoAutoComplete({
            dataSource: {
                data: [
                {name: "Google", link: "http://www.google.com/"}, 
                {name: "Bing", link: "http://www.bing.com/"}
                ]
            },
            dataTextField: "name",
            template: '<span data-href="#:link#">#:name#</span>',
            select: function(e) {
                var href = e.item.find("span").data("href");
                window.open(href);
            }
        });
    </script>
-->
    <script>
        var dataSource = new kendo.data.DataSource({
transport: {
read: {
url: "json.txt",
dataType: "json",
data: {
q: "javascript"
}
}
},
schema: {
data: "results"
}

});

        $("#autocomplete").kendoAutoComplete({
            dataSource: dataSource,
            dataTextField: "name",
            template: '<span data-href="#:link#">#:name#</span>',
            select: function(e) {
                var href = e.item.find("span").data("href");
                window.open(href);
            }
        });

    </script>
</body>
</html>



JSON FILE:

{
    "results": [
                {name: "Google", link: "http://www.google.com/"}, 
                {name: "Bing", link: "http://www.bing.com/"}
               ]
}

0
Alexander Valchev
Telerik team
answered on 12 Nov 2013, 09:17 AM
Hello Amin,

The Json which you provided is not valid (you can verify that here).
Please use a valid one:
{
    "results": [
        {
            "name": "Google",
            "link": "http://www.google.com/"
        },
        {
            "name": "Bing",
            "link": "http://www.bing.com/"
        }
    ]
}


Regards,
Alexander Valchev
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Mithun Prasath
Top achievements
Rank 1
answered on 26 Nov 2013, 05:36 AM
i need a sample for auto complete with jsp, the data for suggestion is from database pls 
0
Alexander Valchev
Telerik team
answered on 26 Nov 2013, 08:56 AM
Hello Mithun,

Did you checked the JSP version of the AutoComplete demos?


In addition you can check the AutoComplete JSP Ajax binding help topic:
If you have any further questions please post them in the JSP section of the forum.
Thank you in advance for the understanding.

Regards,
Alexander Valchev
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Tags
AutoComplete
Asked by
Jnchaves
Top achievements
Rank 1
Answers by
Alexander Valchev
Telerik team
Jnchaves
Top achievements
Rank 1
Mithun Prasath
Top achievements
Rank 1
Share this question
or