How to remove autocomplete from input? - autocomplete

Question

I have tried autocomplete="off", autocomplete="none" , autocomplete="/" ,autocomplete="new-text"
but still it shows autocomplete
browser autocomplete overlaps typehead autocomplete popup
I don't Know how to remove this autocomplete
Thank you in advance!!
<form name="clientForm" class="kt-form kt-form--label-right" novalidate role="form" autocomplete="new-text">
<div class="form-group row">
<div class="col-lg-3 col-sm-6 col-xs-12 typeahead">
<label for="country">Country <span style="color:red">*</span></label><br />
<input id="add-c-country" class="form-control" name="country" type="text" dir="ltr" placeholder="Enter Country" autocomplete="new-text" />
<div class="form-text text-muted" ng-show="clientForm.country.$touched || clientForm.$submitted"
ng-messages="clientForm.country.$error" role="alert">
<div class="req-red" ng-message="required">Please Select Country</div>
</div>
</div>
</div>
</form>
I am using typeahead.js for auto complete
function applyAutocomplete(id, array,namE) {
$('input#' + id).typeahead({
hint: true,
highlight: true,
minLength: 1,
accent: true,
offset: true
}, {
name: namE,
limit: 100,
source: substringMatcher(array)
});
}
applyAutocomplete('add-c-country', $ctrl.countryNameList,'country');

Answer 1

Could you try just completely removing the autocomplete parameter?
Like this:
<input id="add-c-country" class="form-control" name="country" type="text" dir="ltr" placeholder="Enter Country" />
Edit after reading your edited question:
You can not disable browser autocomplete in your own code. That is a browser specific setting.
For chrome you can do the following:
Click the Chrome menu icon. (Three lines at the top right of the screen.)
Click on Settings.
At the bottom of the page, click 'Show advanced Settings'
In the Passwords and Forms section, uncheck 'Enable Autofill to fill out web forms in a single click'.
Hope this solves your problem.
Best regards.