jQWidgets is a JavaScript framework for making web-based applications for PC and mobile devices. It is a very powerful and optimized framework, platform-independent, and widely supported. The jqxFormattedInput is a jQuery input widget that is used for taking input of numbers in the binary, octal, decimal, or hexadecimal format. The input number can be incremented/decremented through the spin buttons which are optional and the numeral system can be changed through a pop-up menu which is also optional.

The open event is used to trigger when the pop-up is opened.

Syntax:

$("Selector").on("open", function (event) { });

Linked Files: Download jQWidgets from the given link https://www.jqwidgets.com/download/. In the HTML file, locate the script files in the downloaded folder.

<link rel=”stylesheet” href=”jqwidgets/styles/jqx.base.css” type=”text/css” />
<script type=”text/javascript” src=”scripts/jquery-1.11.1.min.js”></script>
<script type=”text/javascript” src=”jqwidgets/jqxcore.js”></script>
<script type=”text/javascript” src=”jqwidgets/jqxformattedinput.js”></script>

The below example illustrates the jQWidgets jqxFormattedInput open event.

Example:

Output:

Reference: https://www.jqwidgets.com/jquery-widgets-documentation/documentation/jqxformattedinput/jquery-formatted-input-api.htm