score:3
I think you might struggle with the basic understanding on how to disable auto complete, so here's a catch up:
How does disabling auto complete work in HTML?
autocomplete
is a HTML attribute
for input
elements. Possible values are on
and off
.
You can disable autocomplete by using it like this:
<input type="email" name="email" autocomplete="off">
How can I apply this to React?
React has always provided a JavaScript-centric API to the DOM. Since React components often take both custom and DOM-related props, React uses the camelCase convention just like the DOM APIs
The conclusion is, you have to set the property autoComplete
to off
on those components aka input fields, not on the from element around the input fields.
Example
import React from "react";
import ReactDOM from "react-dom";
import "./styles.css";
function App() {
return (
<div className="App">
<input name="email" autoComplete='off' />
</div>
);
}
const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);
In your case, the components is propably called TextInput
.
After looking at the source, I've found out that AOR uses TextField
of material-ui
, which accepts autoComplete
as property.
So if you either pass input={{ autoComplete: 'off' }}
or options={{ autoComplete: 'off' }}
you should be good to go.
score:0
No. This is not possible on Chrome
Previously you can set autoComplete="off"
, but now it's not possible because Google Chrome now allow you to control it anymore.
Source: stackoverflow.com
Related Query
- disabling autocomplete for admin-on-rest SimpleForm
- TypeScript workaround for rest props in React
- Compile error using the Component Lab > Autocomplete feature for SVG Icons in Material UI
- ant design v4 breaks react testing library tests for Select and Autocomplete
- How do I turn on the webview autocomplete for an login form in Ionic's capacitor in iOS?
- How to refresh a List View in admin on rest
- Spring Boot war or jar for rest api project
- Folder structure for React and Django REST
- What type should I declare for object rest props?
- How to display initialValues for material-ui autocomplete field?
- Getting keyboard navigation to work with MUI Autocomplete and SimpleBar for react
- Turn off autoComplete for all inputs in React app
- How to hide a label for Autocomplete on onFocus in Material-ui?
- Custom title with image in admin on rest
- how to create load more bottom in nextjs for get rest of data? (Next.js Pagination)
- Admin On Rest Framework or React drop zone, Issue in uploading a file to firebase
- Customize Antd AutoComplete to use {children} for both dataSource and input
- ReactJS - Disable Click & Hold for Context menu for mobile without disabling click events?
- How can I disable multiline for autocomplete material-ui demo?
- Chrome, Edge - Disable autofill / autocomplete for fields
- Setting a Max Length for a Material-UI AutoComplete that uses free solo
- Access current record in admin on rest edit
- Is it safe to use useRef (React) to save state of a canvas (Konva) for REST API
- 2 different layouts 1 for admin panel and 1 for front website in Next.JS?
- react: how to pass in URLs for REST APIs
- Nested Route not working in react router dom for my admin dashboard
- How to use React Redux state for conditionally showing and Disabling a Button
- React suggestions and autocomplete does not work for files with js extension in VSCode
- Two logical operators for the disabling the button
- Admin on rest - How to display a Datagrid withtout a ReferenceField?
More Query from same tag
- Menu displaying on all the pages. Is there any way only to display on a specific page in React?
- How to use breakpoints for theme spacing in material-ui
- Fetch data from API when form's search button clicked and show data on another page in React JS
- React Js - Material UI - Change Min Date as per previous selection
- Trying to create a special design pattern in react, unsure how to achieve it
- Testing Mocked Fetch Api in Jest returns undefined
- How to animate a React component on render?
- How do I upload a file using Fetch and Multer and post form data in the same request?
- How to conditionally render a prop initialized as an empty object?
- React doesn't work as expected in working with two components file
- Cannot use react-color Saturation with @types/react-color
- Next.js setting current active class with Link and router
- React onClick event for multiple divs
- Reactjs - value undefined
- How to solve this error when running 'yarn start'?
- Using module.exports in React ES6
- Property 'element' does not exist on type 'JSX.IntrinsicElements'
- Workbox webpack plugin display offline screen
- How could I use a class component inside function component
- React and ECMA6
- How can I add shadow on piechart in recharts?
- Passing state from child to parent using hooks - React
- Render JSX from material-ui Button onClick
- Alert in if/else statement in React JS
- onChange event triggered twice within ReactJS project
- .map() working outside of render function, but fails when used inside render
- Set history dynamically without page reload
- ReactJS TypeError: Cannot read properties of undefined (reading 'main')
- Reactjs state initialize an array of values
- Unhandled rejection SubmissionError: Submit Validation Failed