JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<h1>Normal Form</h1>
<form id="normalForm" action="/api/submitData" method="POST">
<input name="willAutofillInTheFutureNormal" type="text" />
<input type="submit" value="Submit" />
</form>
<h1>AJAX Form</h1>
<form id="ajaxForm" action="/api/submitDataAjax" method="POST">
<input name="willAutofillInTheFutureAjax" type="text" />
<input type="submit" value="Submit" />
</form>
JavaScript
$("#ajaxForm").submit(e => {
e.preventDefault();
const data = {
data: document.getElementsByName("willAutofillInTheFutureAjax")[0].value
};
$.post("/api/submitData", JSON.stringify({
data: data
}));
// Apparently if you re-run with the data in the field, it saves it to autocomplete, which is a false positive.
e.target.reset();
});