How to use browser autocomplete when input name contains an array?

Question

I have a form with several input fields with the same name and an array value. For instance:

<input type="text" name="customer_reference[1]">
<input type="text" name="customer_reference[2]">
<input type="text" name="customer_reference[3]">

I would like to use the browser auto complete function. This function uses the name tag. Therefore I have different auto complete suggestions for customer_reference[1] then for customer_reference[2] .

Is there a way to let the browser threat the fields as being the same? So when the user starts to type in a reference, the browser will give the same suggestions in all fields with the same name, but a different array value?

I tried using, but no difference:

<input type="text" name="customer_reference[1]" autocomplete="customer_reference">
<input type="text" name="customer_reference[2]" autocomplete="customer_reference">
<input type="text" name="customer_reference[3]" autocomplete="customer_reference">

I also tried setting an additional id or class, but the browser does not seem to use this. And I also tried using a label.

Is there any way to let the browser auto complete function know that the fields are of the same 'type of data', so it will give the same suggestions?

Answer 1

You can use datalist tag.Since the datalist tag is used to provide an "autocomplete" feature on input elements.

For eg:

 <input list="browsers" name="browser">
  <datalist id="browsers">
    <option value="Internet Explorer">
    <option value="Firefox">
  </datalist>