pp-autofocus

The pp-autofocus attribute is used focus an INPUT or TEXTAREA element when the page loads or when the element is inserted into the DOM. It is commonly used to automatically focus on a form field when a page is loaded or when a modal dialog is displayed.

Use Cases

Autofocus: Use the pp-autofocus attribute when you need to automatically focus on an input field or textarea. This can be useful when the page loads or when the element is inserted into the DOM. For example, you can use autofocus to focus on a search field when a page is loaded or when a modal dialog is displayed. Another use case is when you want to edit a form field and the cursor should be positioned at the end of the text.

Note: The pp-autofocus attribute only accepts JSON format as its value, such as pp-autofocus="{'key': 'value'}". The JSON format can be a number or an object with properties start, end, and length. When using the start property, the focus will be moved to the first character of the input value or the beginning of the textarea content. With the end property, the focus will be moved to the last character. And with the length property, the focus will be moved to the specified character position.

Syntax

  • pp-autofocus="{'start': true}": Automatically focuses on the element when the page loads or when the element is inserted into the DOM, positioning the cursor at the beginning of the input value or the start of the textarea content. Alternatively, you can use the standard autofocus attribute.
  • pp-autofocus="{'end': true}": Focuses on the element when the page loads or when the element is inserted into the DOM and moves the focus to the last character of the input value or the end of the textarea content.
  • pp-autofocus="{'length': 5}": Focuses on the element when the page loads or when the element is inserted into the DOM and moves the focus to the specified character position of the input value or the textarea content.