Autocomplete attribute in html form not working - php

Question

I want to have an update option in my html form in which user enters First_name then all the fields should be autofilled with corresponding values in mysql table.
I tried to use autocomplete attribute in few fields and it is not working.Please check the code and let me know if there is any error.Or any other way to implement the requirement.
<form method="post" action="demo1.php" autocomplete="on">
<link rel="stylesheet" href="contact_css.css">
<!--Create a table -->
<table>
<tr><td><b>Contact Information</b></td>
</tr>
<tr>
<div class="leftside">
<td>ContactID</td>
<td><input type="text" name="ContactID" autocomplete="ContactID"></td>
</div>
<div class="rightside">
<td>ContactOwner</td>
<!-- <td><input type="text" name="ContactOwner"></td>-->
<td><select name="ContactOwner">
<option value="None">None</option>
<option value="Malik">Malik</option>
<option value="Manish">Manish</option>
<option value="Ankit">Ankit</option>
<option value="Vikrant">Vikrant</option>
</select></td>
</div>
<tr>
<div class="rightside">
<td>LeadSource</td>
<td><select name="LeadSource">
<option value="None">None</option>
<option value="Advertisement">Advertisement</option>
<option value="ColdCall">ColdCall</option>
<option value="EmployeeReferral">EmployeeReferral</option>
<option value="ExternalReferral">ExternalReferral</option>
<option value="OnlineStore">OnlineStore</option>
<option value="Partner">Partner</option>
<option value="Web">Web</option>
<option value="TradeShow">TradeShow</option>
</select></td>
<!--<td><input type="text" name="LeadSource"></td>-->
</div>
<div class="leftside">
<td><label for="First_name">First_name</td>
<td><input type="text" id="First_name" name="First_name" autocomplete="First_name"></td>
</div>
</tr>
<tr>
<div class="rightside">
<td>Middle_name</td>
<td><input type="text" name="Middle_name" autocomplete="Middle_name"></td>
</div>
<td>Last_name</td>
<td><input type="text" name="Last_name" autocomplete="Last_name"></td>
</tr>
<tr>
<td>AccountName</td>
<td><input type="text" name="AccountName"></td>
<td>EmailID</td>
<td><input type="text" name="EmailID"></td>
</tr>
<tr>
<td>Department</td>
<td><input type="text" name="Department"></td>
<td>Phone</td>
<td><input type="text" name="Phone"></td>
</tr>
<tr>
<td>Mobile</td>
<td><input type="number" name="Mobile"></td>
<td>Fax</td>
<td><input type="number" name="Fax"></td>
</tr>
<tr>
<td>DOB</td>
<td><input type="date" name="DOB"></td>
<td>Assistant</td>
<td><input type="text" name="Assistant"></td>
</tr>
<tr>
<td>AsstPhone</td>
<td><input type="number" name="AsstPhone"></td>
<td>ReportsTo</td>
<td><input type="text" name="ReportsTo"></td>
</tr>
<tr>
<td>LinkedIn</td>
<td><input type="text" name="LinkedIn"></td>
<td>CallStatus</td>
<td><select name="CallStatus">
<option value="None">None</option>
<option value="AnsweringMachine">AnsweringMachine</option>
<option value="Callback">Callback</option>
<option value="NotInterested">NotInterested</option>
<option value="Prospect">Prospect</option>
<option value="WrongContact">WrongContact</option>
<option value="PerformedInternally">PerformedInternally</option>
<option value="LessThan30Employee">LessThan30Employee</option>
</select></td>
</tr>
</table>
<!-- Second table-->
<table>
<tr><td><b>Address Information</b></td>
</tr>
<tr>
<div class="leftside">
<td>Street</td>
<td><input type="text" name="Street"></td>
</div>
<div class="rightside">
<td>OtherStreet</td>
<td><input type="text" name="OtherStreet"></td>
</div>
</tr>
<tr>
<div class="leftside">
<td>City</td>
<td><input type="text" name="City"></td>
</div>
<div class="rightside">
<td>State</td>
<td><input type="text" name="State"></td>
</div>
</tr>
<tr>
<td>Zip</td>
<td><input type="text" name="Zip"></td>
<td>Country</td>
<td><input type="text" name="Country"></td>
</tr>
</table>
<!--Third table-->
<table>
<tr><td><b>Description Information</b></td>
</tr>
<tr>
<td>Description</td>
<td><input type="text" name="Description" class="Description"></td>
</table>
<button type="button">Cancel</button>
<!-- <button type="submit">Save and New</button>-->
<button type="submit">Save</button>
</form>
</body>

Answer 1

This is not how autocomplete attribute is working.
Definition and Usage
The autocomplete attribute specifies whether or not an input field
should have autocomplete enabled.
Autocomplete allows the browser to predict the value. When a user
starts to type in a field, the browser should display options to fill
in the field, based on earlier typed values.
Note: The autocomplete attribute works with the following
types: text, search, url, tel, email, password, datepickers, range,
and color.
SYNTAX
<input autocomplete="on|off">
This attribute can have only value on or off
Refer to w3schools docs for more details
If you want to have a default value in those fields you can set it inside value attribute or design your database with DEFAULT values.
So you can change <input type="text" name="ContactID" autocomplete="ContactID"> to <input type="text" name="ContactID" value="ContactID">