How to call a jquery function from an autocomplete search box which is specified in VF Component

Question

I'm having an auto-complete search box which lists the product details on entering the string. I have specified this in VF component and referring the same in my vf page. Now I want to hide one text box whenever the user enter the string in the search box and select any one of the products listed in the auto complete search box. Below are the references of the searchbox in VF page, VF Component and JS function

VF Component :

<apex:attribute name="searchBoxId" type="String" default="searchBox"
                description="Id attribute for the search input box." />

VF Page :

<c:Typeahead placeholder="Search"
                 searchBoxId="BoxId" />

I'm trying to obtain the entered value in a JS function but I'm getting value as empty.

JQuery function:

function Check() {
    var searchstr = $j('#boxId').attr("value");
}

Answer 1

You can add apex:actionfunction on the page which will expose a Javascript function that can be called from anywhere on the page, including from within components on that page.

This function can be called from your component to make a call back to the page itself when the user selects a suggestion from the box.