I'm writing a tool application where people fill in forms for Purchase orders and timesheets. My forms all work via the ajax calls and using jquery exclusively from the documentation and tutorials. My problem is however when someone clicks in a number field in the PO after the form was posted once, it automatically autocompletes that number field when autocomplete makes no logical sense there. Is there a way to turn this off? I've already tried autocomplete="off" in the input html which didn't work and I tried some javascript that was supposed to do the same, also to no avail. (
http://css-tricks.com/snippets/html/autocomplete-off/) This tag for inputs is supposedly HTML5 standard but both Chrome and IE seem to be ignoring it.
<html>
<head>
<meta charset="UTF-8">
<meta http-equiv="cache-control" content="no-cache" />
<meta http-equiv="pragma" content="cache" />
<title>Edit Project</title>
<link rel="stylesheet" type="text/css" href="themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="themes/icon.css">
<link rel="stylesheet" type="text/css" href="demo.css">
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript" src="jquery.easyui.min.js"></script>
</head>
<body>
<form id="ff" method="post" autocompete="off" >
Quantity:
<input class="easyui-numberbox" type="edit" name="quantity" value="" style="width:145px;" data-options="min:0,precision:2" id="quantity" autocomplete="off"/>
</form>
<a href="javascript:void(0)" class="easyui-linkbutton" onclick="submitForm()">Submit</a>
<script>
function submitForm(){
var url = 'tested.php';
jqxhr = $.ajax({
type: "POST",
dataType: "json",
url : url,
data: $("#ff").serialize()
});
jqxhr.always(function(){
$('#dg').datagrid('reload');
$(':input','#ff')
.not(':button, :submit, :reset, :hidden')
.val('');
});
}
</script>
</body>
</html>