This project was bootstrapped with Create React App.

Available Scripts

In the project directory, you can run:

jquery-react-autocomplete

A react autocomplete using your loved one jQuery

Installation

Run yarn add jquery-react-autocomplete

Usage

Import:

import JqueryReactAutocomplete from "jquery-react-autocomplete";

and use as:

<JqueryAutocomplete inputProps={{id : 'sourceCity',label:'City: ',value:sourceCity.label || ''}} onSourceSelect={handleSourceCitySelect}/>

Available Props are

| Prop | Type | Default | | ------------- |---------| ------------------------------------------------------------------ | | inputProps | Object | {id : 'sourceCity',label:'City: ',value:sourceCity.label || ''} | | onSourceSelect | Function| Function to get the selected city |

This autocomplete assumes API data like:

        {city_name: "Bangalore", city_id: 1001968, city_label: "Bangalore (All Locations)"}

You can change autocomplete below section, if needed...

        $.map(data.city_list, function(item) {
            return {
            label: item.city_label,
            value: item.city_name,
            name: item.city_name,
            code: item.city_id
        };

Example:

function App() {
  const[sourceCity,setsourceCity]  = useState({});

  const handleSourceCitySelect = (value) => {
    setsourceCity(value);
    console.log(value);
  }  


  return (
    <div className="col-sm-6 pad-3">
    <JqueryReactAutocomplete inputProps={{id : 'sourceCity',label:'City: ',value:sourceCity.label || ''}} onSourceSelect={handleSourceCitySelect}/>
  </div>
  );
}

}