Searchbar网站：按页面标题而不是页面链接Javascript搜索

Question

So i'v found this code to search other pages from the main page of my website, and it works great, but the autocomplete shows the link of the page instead of the title of the page , can anyone help me to modify the code ?

<form id="form1" runat="server" class="online-form">
    <div class="ui-widget">
        <input id="tags" class="form-control" placeholder="Rechercher un service…" required="" />
    </div>
</form>
<script>
$(function () {
    var availableTags = ["page1.html","page2.html","page3.html"];
    $("#tags").autocomplete({
        source: availableTags,
        select: function (e, ui) {
            var value = ui.item.value;
            window.location.href = "../" + value;
        },
    });
});
</script>

Answer 1

The best way to make what you want and still continuing using jQuery's autocomplete is to create an additional array with the links. On select we will check the position of the AvailableTags array and then use the new array for the redirect.

<script>
    $(function () {
        var availableTags = ["Page 1", "Page 2"];
        var availableTagsLinks = ["page1.htm", "page2.htm"];
        $("#tags").autocomplete({
            source: availableTags,
            select: function (e, ui) {
                var value = ui.item.value;
                var indexPos = $.inArray(ui.item.value, availableTags);
                window.location.href = "../" + availableTagsLinks[indexPos];
            },
        });
    });
</script>